how to read form element values

Question

chaituu 0 Newbie Poster

15 Years Ago

where to put <form> tag in dynamic rows?

In the below code when i write <form> tag after <BODY> i am getting weird exception.
"Internet explorer cannot open internet site ;operation aborted".you can check the code in your browser.

but when i place <form> after end </script> tag then page is coming .i dont know what is the exact problem?Is it browser problem or Coding problem?.

My only intention to read form elements at the server side.In the present code when i submit the page values are not coming to the servlet page where i need to read the values and insert into the database.

<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
 </HEAD>
   <BODY>
        <form>
 
  <script language="JavaScript">
   
 table=document.createElement("table");
        table.setAttribute("id","TableA");
        table.setAttribute("border","0");
        table.setAttribute("width","50%");
        table.bgColor="lightblue"
    body = document.createElement("tbody");
    row =document.createElement("tr");
            cell11 =document.createElement("td");
    cell11.appendChild(document.createTextNode(''));
        cell11.setAttribute("width","5%");
    row.appendChild(cell11);
 
    cell0 =document.createElement("td");
    cell0.appendChild(document.createTextNode('Sno'));
        cell0.setAttribute("id","Sno");
        cell0.setAttribute("width","5%");
    row.appendChild(cell0);
 
 
    cell1 =document.createElement("td");
    cell1.appendChild( document.createTextNode('ContainerType'));
        cell1.setAttribute("width","10%");
        cell1.setAttribute("font-style" ,"italic");
    row.appendChild(cell1);
 
   cell2 =document.createElement("td");
   cell2.setAttribute("width","10%");
    cell2.appendChild( document.createTextNode('ContainerNumber'));
    row.appendChild(cell2);
 
        cell3 =document.createElement("td");
        cell3.setAttribute("width","20%");
    cell3.appendChild( document.createTextNode('ContainerDescription'));
    row.appendChild(cell3);
        body.appendChild(row);
 
	window.onload =function dynamicRows()
	{
	  
					
	 
			row1 =document.createElement("tr");
	 
	 
		cell10 =document.createElement("td");
			check= document.createElement("input");
			check.setAttribute("type","checkbox");
			check.setAttribute("name","checked");
			check.setAttribute("value","true");
	 
		cell10.appendChild(check);
		row1.appendChild(cell10);
	 
	 
		cell8 =document.createElement("td");
			cell8.appendChild(document.createTextNode(document.getElementById('TableA').rows.length));
			row1.appendChild(cell8);
	 
	 
	 
		cell4 =document.createElement("td");
			select =document.createElement("select");
			select.setAttribute("name","contype");
			select.setAttribute("id","contype0");
	 
			option =document.createElement("option");
			option.setAttribute("value","20F");
			option.appendChild(document.createTextNode("20F"));
			select.appendChild(option);
	 
			option =document.createElement("option");
			option.setAttribute("value","40H");
			option.appendChild(document.createTextNode("40H"));
			select.appendChild(option);
	 
			option =document.createElement("option");
			option.setAttribute("value","60L");
			option.appendChild(document.createTextNode("60L"));
			select.appendChild(option);
	 
			option =document.createElement("option");
			option.setAttribute("value","80M");
			option.appendChild(document.createTextNode("80M"));
			select.appendChild(option);
	 
		cell4.appendChild(select);
		row1.appendChild(cell4);
	 
		cell5 =document.createElement("td");
			ContainerInput= document.createElement("input");
			ContainerInput.setAttribute("type","text");
			ContainerInput.setAttribute("name","containerno");
			ContainerInput.setAttribute("value",'CONATIONER156');
	 
		cell5.appendChild(ContainerInput);
		row1.appendChild(cell5);
	 
	 
		cell6 =document.createElement("td");
			ContainerDesc= document.createElement("input");
			ContainerDesc.setAttribute("type","text");
			ContainerDesc.setAttribute("name","containerdesc");
			ContainerDesc.setAttribute("value",'TU');
	 
		cell6.appendChild(ContainerDesc);
		row1.appendChild(cell6);
	 
			cell7 =document.createElement("td");
			add= document.createElement("input");
			add.setAttribute("type","button");
			add.setAttribute("name","add");
			add.setAttribute("value","+");
			add.onclick = function(){ addRow(); }
		cell7.appendChild(add);
		row1.appendChild(cell7);
	 
					if(document.getElementById('TableA').rows.length >1)
					{
							 cell9 =document.createElement("td");
							remove= document.createElement("input");
							remove.setAttribute("type","button");
							remove.setAttribute("id","remove");
							remove.setAttribute("name","remove");
							remove.setAttribute("value","-");
			
							remove.onclick = function(){  
											removeRow(this);
							};
	 
	 
							cell9.appendChild(remove);
							row1.appendChild(cell9);
					}
							body.appendChild(row1);
	 
					if(document.getElementById('contype0'))
									{
					
							for (j=0;j<document.getElementById('contype0').length;j++)
													  {
															   if ('20F' == document.getElementById('contype0').options[j].value)
															   {
																			document.getElementById('contype0').options[j].selected = true;  
																		 break;
															   }
													  }
									}
	 
	 
			
	}
 
        table.appendChild(body);
    document.body.appendChild(table);
 
                        
 
 function addRow()
  {
         dynamicRows();
  }
function removeRow(theRow){
 
                var tab=document.getElementById('TableA');
                index= theRow.parentNode.parentNode.rowIndex;
       tab.deleteRow(index);
 
          for (i=1;i<tab.rows.length;i++)
          {
                        tab.rows[i].cells[1].innerHTML = i;
          }
}
 
 
  </script>
 
 
 
 
 
         <input type="submit" name="submit" value="submit">
 
 </form>
 
 </BODY>
</HTML>

javascript

2 Contributors
1 Reply
94 Views
12 Hours Discussion Span
Latest Post 15 Years Ago Latest Post by essential

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

essential 84 Posting Shark Featured Poster · Answer 1 · 2009-05-03T17:12:35+00:00

You can use this demo as a standard, when you are creating table element's.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<HTML lang="en">
<HEAD>
<META http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<META http-equiv="Content-Type" content="text/html; charset=utf-8">
<TITLE>DEMO</TITLE>
<SCRIPT type="text/javascript">
<!--
var createTable;

createTable = function() {
tableATT = document.createAttribute("style");
tableATT.nodeValue = "background-color : lightblue; color : white;";

form = (( document.getElementById ) ? document.getElementById("frm") : document.all.frm );

table = document.createElement("table");
tbody = document.createElement("tbody");

table.setAttributeNode( tableATT );
table.width = "100%"
table.id = "TableA";
table.border = "0";
tbody.id = "tb";
table.appendChild(tbody);
form.appendChild(table);
t = (( document.getElementById ) ? document.getElementById("tb") : document.all.tb );
cell11 = t.insertRow( 0 ).insertCell(0);
cell11.appendChild(document.createTextNode("1")); // Goes with row1 cell1

cellWidth = document.createAttribute("style");
cellWidth.nodeValue = "width: 5%;";
cell11.setAttributeNode( cellWidth ); // Setting the attribute cell11

cell0 = t.rows[0].insertCell(1);
cell0.appendChild(document.createTextNode("Sno")); // cell2

cell1 = t.rows[0].insertCell(2);
cell1.appendChild(document.createTextNode("ContainerType")); // cell3

cell2 = t.rows[0].insertCell(3);
cell2.appendChild(document.createTextNode("ContainerNumber")); // cell4

cell3 = t.rows[0].insertCell(4);
cell3.appendChild(document.createTextNode("ContainerDescription")); // cell5

cell0.id = "Sno"; // Setting the id for cell0.

cell0Width = document.createAttribe("style"); // Setting attribute with cell0
cell0Width.nodeValue = "5%";
cell0.setAttributeNode( cell0Width );
// You can simplify things, if you will code your page in this way.
 
};
window.onload = createTable;
// -->
</SCRIPT>
</HEAD>
<BODY>
<FORM id="frm" action="#" onsubmit="return false;">
<DIV> 
<INPUT type="submit" name="submit" value="submit">
</DIV>
</FORM>
</BODY>
</HTML>