Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 24
  1. #1
    New Coder
    Join Date
    May 2011
    Posts
    85
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Adding dropdown list on a cell

    I have a dropdown list on each cell of table row. Now what I need is dynamically add more dropdownlist on a particular cells with pressing the add button. Any code snippet to help on this? Thank you.

  • #2
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,918
    Thanks
    56
    Thanked 545 Times in 542 Posts
    Code:
    function makeSelect(){
    var thecell=document.getElementById("cell23"); //or however you want to reference the cell you want to the select to
    var sel=document.createElement("select");
    sel.options[0]=new Option("text","value"); //easier if you can do this in a loop
    thecell.appendChild(sel)
    }

  • #3
    New Coder
    Join Date
    May 2011
    Posts
    85
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Dear Xewalho,
    I have already have the codes and call the function addSubRows. There are few issues I know how to add the combo but that is the static one I would just like to copy and add. NExt thing is that in every td would like to have a table and in the table I would like to add add one combo box, input text and remove button and below row should be for the error message. So how to change their id dynamically and also the sub tables too. Below is my codes.


    Code:
    <html>
    <head>
    	<script language="javascript">
    		function addRow(tableID) {
    
    			var table = document.getElementById(tableID);
    
    			var rowCount = table.rows.length;
    			var row = table.insertRow(rowCount);
    
    			var colCount = table.rows[0].cells.length;
    
    			for(var i=0; i<colCount; i++) {
    
    				var newcell	= row.insertCell(i);
    
    				newcell.innerHTML = table.rows[1].cells[i].innerHTML;
    				newcell.innerHTML = newcell.innerHTML;
    				
    		}
    		
    		function addSubRow2(cell){
           var dropdown="<SELECT class=\"select\" name=\"country\">\n" +
                    "<OPTION value=\"1\">Serial 1<\/OPTION>\n" +
                    "<OPTION value=\"2\">Serial 2<\/OPTION>\n" +
                    "<OPTION value=\"3\">Serial 3<\/OPTION>\n" + 
                    "<OPTION value=\"4\">Serial 4<\/OPTION>" +
                    "<OPTION value=\"5\">Serial 5<\/OPTION>" + 
                    "<\/SELECT>";
           
           
          
            cell.innerHTML += "<br\/ >" + dropdown;
        }
    
    
    		function deleteRow(tableID) {
    			try {
    			var table = document.getElementById(tableID);
    			var rowCount = table.rows.length;
    
    			for(var i=0; i<rowCount; i++) {
    				var row = table.rows[i];
    				var chkbox = row.cells[0].childNodes[0];
    				if(null != chkbox && true == chkbox.checked) {
    					if(rowCount <= 1) {
    						alert("Cannot delete all the rows.");
    						break;
    					}
    					table.deleteRow(i);
    					rowCount--;
    					i--;
    				}
    
    
    			}
    			var table = document.getElementById(tableID);
    			for (var i = 0, row; row = table.rows[i]; i++) {
    				  row.id="row"+i;
    			   //iterate through rows
    			   //rows would be accessed using the "row" variable assigned in the for loop
    			   for (var j = 0, col; col = row.cells[j]; j++) {
    			     //iterate through columns
    			     //columns would be accessed using the "col" variable assigned in the for loop
    			     //alert("J : "+j);
    			     col.id="col"+i;
    			     if(j==0)
    			     {
    			     	
    			     }
    			     else if(j==1)
    			     {
    			     	
    			    }
    			   }  
    			}
    			
    			}catch(e) {
    				alert(e);
    			}
    		}
    
    	</script>
    </head>
    <body>
      Begin Location : <select class='select' id="beginLocation" name="beginLocation">
    					<option value="1">Loc 1</option>
    					<option value="2">Loc 2</option>
    					<option value="3">Loc 3</option>
    					<option value="4">Loc 4</option>
    					<option value="5">Loc 5</option>
    				</select>
    				<p type="text" class=error id='beginLocation_Error'>
    	<br\>
    	<input type="button" value="Add Row" onclick="addRow('dataTable')" />
    
    	<input type="button" value="Delete Row" onclick="deleteRow('dataTable')" />
    
    	<table id="dataTable" width="350px" border="1">
    		<tr>
    			<th></th>
    			<th>Client</th>
    		  <th>Location</th>
    		  <th>Serial</th>
    		</tr>
    		
    		<tr>
    			<td id="col_0_0"><input type="checkbox" name="chk"/></td>
    			<td id="col_0_1">
    				<select class='select' id="client1" name="client1">
    					<option value="1">Client 1</option>
    					<option value="2">Client 2</option>
    					<option value="3">Client 3</option>
    					<option value="4">Client 4</option>
    					<option value="5">Client 5</option>
    				</select><p type="text" class=error id='client_0_Error'>				
    			</td>
    			
    			<td id="col_0_1">
    				<select class='select' id="location1" name="location1">
    				  <option value="1">Loc 1</option>
    					<option value="2">Loc 2</option>
    					<option value="3">Loc 3</option>
    					<option value="4">Loc 4</option>
    					<option value="5">Loc 5</option>
    				</select>
    				<p type="text" class=error id='beginLocation_Error'>				
    			</td>
    			
    			<td id="col_0_3">
    				<input type="button" value="Add Serial" onclick="addSubRow2(this.parentNode);" />
    				<br\>
    				<table id="sub0">
    					<tr>
    						<td>
    							<select class='select' id="serial_0_1" name="serial_0_1">
    								<option value="1">Serial 1</option>
    								<option value="2">Serial 2</option>
    								<option value="3">Serial 3</option>
    								<option value="4">Serial 4</option>
    								<option value="5">Serial 5</option>
    							</select>
    					   </td>
    					   <td>
    					   	 <input type="text" id="txt_0_1" name="txt_0_1">					   	
    					   </td>
    					   <td>
    					   	 <input type="button" value="Remove" onclick="removeSubRow2(this.parentNode);" />					   	
    					   </td>
    				  </tr>
    				  <tr>
    				  	 <td>
    				  	 <p  class=error id="selecterror_0_1">
    				  	</td>
    				  	 <td>
    				  	 <p class=error id="inputerror_0_1">
    				  	</td>	
    				  	<td>
    				  	 
    				  	</td>
    				  </tr>
    				</table>
    				
    			</td>
    		</tr>
    	</table>
    
    </body>
    </html>

  • #4
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,918
    Thanks
    56
    Thanked 545 Times in 542 Posts
    whose ID do you want to change dynamically?

    if you are going the route of just copying innerHTML into other places you can use the same workaround for adding another table

    Code:
    <html>
    <head>
    	<script type="text/javascript">
    		function addRow(tableID) {
    
    			var table = document.getElementById(tableID);
    
    			var rowCount = table.rows.length;
    			var row = table.insertRow(rowCount);
    
    			var colCount = table.rows[0].cells.length;
    
    			for(var i=0; i<colCount; i++) {
    
    				var newcell	= row.insertCell(i);
    
    				newcell.innerHTML = table.rows[1].cells[i].innerHTML;
    				
    				}
    		}
    		
    		function addTable(cell){
    		cell.innerHTML+=document.getElementById("extratable").innerHTML
    		}
    
    
    		function deleteRow(tableID) {
    			try {
    			var table = document.getElementById(tableID);
    			var rowCount = table.rows.length;
    
    			for(var i=0; i<rowCount; i++) {
    				var row = table.rows[i];
    				var chkbox = row.cells[0].childNodes[0];
    				if(null != chkbox && true == chkbox.checked) {
    					if(rowCount <= 1) {
    						alert("Cannot delete all the rows.");
    						break;
    					}
    					table.deleteRow(i);
    					rowCount--;
    					i--;
    				}
    
    
    			}
    			var table = document.getElementById(tableID);
    			for (var i = 0, row; row = table.rows[i]; i++) {
    				  row.id="row"+i;
    			   //iterate through rows
    			   //rows would be accessed using the "row" variable assigned in the for loop
    			   for (var j = 0, col; col = row.cells[j]; j++) {
    			     //iterate through columns
    			     //columns would be accessed using the "col" variable assigned in the for loop
    			     //alert("J : "+j);
    			     col.id="col"+i;
    			     if(j==0)
    			     {
    			     	
    			     }
    			     else if(j==1)
    			     {
    			     	
    			    }
    			   }  
    			}
    			
    			}catch(e) {
    				alert(e);
    			}
    		}
    
    	</script>
    </head>
    <body>
      Begin Location : <select class='select' id="beginLocation" name="beginLocation">
    					<option value="1">Loc 1</option>
    					<option value="2">Loc 2</option>
    					<option value="3">Loc 3</option>
    					<option value="4">Loc 4</option>
    					<option value="5">Loc 5</option>
    				</select>
    				<p type="text" class=error id='beginLocation_Error'>
    	<br\>
    	<input type="button" value="Add Row" onclick="addRow('dataTable')" />
    
    	<input type="button" value="Delete Row" onclick="deleteRow('dataTable')" />
    
    	<table id="dataTable" width="350px" border="1">
    		<tr>
    			<th></th>
    			<th>Client</th>
    		  <th>Location</th>
    		  <th>Serial</th>
    		</tr>
    		
    		<tr>
    			<td id="col_0_0"><input type="checkbox" name="chk"/></td>
    			<td id="col_0_1">
    				<select class='select' id="client1" name="client1">
    					<option value="1">Client 1</option>
    					<option value="2">Client 2</option>
    					<option value="3">Client 3</option>
    					<option value="4">Client 4</option>
    					<option value="5">Client 5</option>
    				</select><p type="text" class=error id='client_0_Error'>				
    			</td>
    			
    			<td id="col_0_1">
    				<select class='select' id="location1" name="location1">
    				  <option value="1">Loc 1</option>
    					<option value="2">Loc 2</option>
    					<option value="3">Loc 3</option>
    					<option value="4">Loc 4</option>
    					<option value="5">Loc 5</option>
    				</select>
    				<p type="text" class=error id='beginLocation_Error'>				
    			</td>
    			
    			<td id="col_0_3">
    				<input type="button" value="Add Serial" onclick="addSubRow2(this.parentNode);" />
    				<br\>
    				<table id="sub0">
    					<tr>
    						<td>
    							<select class='select' id="serial_0_1" name="serial_0_1">
    								<option value="1">Serial 1</option>
    								<option value="2">Serial 2</option>
    								<option value="3">Serial 3</option>
    								<option value="4">Serial 4</option>
    								<option value="5">Serial 5</option>
    							</select>
    					   </td>
    					   <td>
    					   	 <input type="text" id="txt_0_1" name="txt_0_1">					   	
    					   </td>
    					   <td>
    					   	 <input type="button" value="Remove" onclick="removeSubRow2(this.parentNode);" />
    						<input type="button" value="Add table" onclick="addTable(this.parentNode);" />		
    					   </td>
    				  </tr>
    				  <tr>
    				  	 <td>
    				  	 <p  class=error id="selecterror_0_1">
    				  	</td>
    				  	 <td>
    				  	 <p class=error id="inputerror_0_1">
    				  	</td>	
    				  	<td>
    				  	 
    				  	</td>
    				  </tr>
    				</table>
    				
    			</td>
    		</tr>
    	</table>
    <div id="extratable" style="display:none"> 
    	<table width="75%" border="1">
      <tr>
        <td><input type="text" name="textfield"></td>
      </tr>
      <tr>
        <td>
    	<select class='select' id="serial_0_1" name="serial_0_1">
    								<option value="1">Serial 1</option>
    								<option value="2">Serial 2</option>
    								<option value="3">Serial 3</option>
    								<option value="4">Serial 4</option>
    								<option value="5">Serial 5</option>
    							</select>
    							</td>
      </tr>
      <tr>
        <td><input type="button" value="delete this table" onclick="this.parentNode.parentNode.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode.parentNode.parentNode)"></td>
      </tr>
    </table>
    </div>	
    </body>
    </html>

  • #5
    New Coder
    Join Date
    May 2011
    Posts
    85
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Dear Xelawho,
    I would like to change the id of 2nd,3rd column select statement and also the 4th column button and the table in it too. The reason being I need to later capture all this value in a php page.Does it make sense to change the id to be a sequence id or you have other method?

  • #6
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,918
    Thanks
    56
    Thanked 545 Times in 542 Posts
    I'm not meaning to be rude, but this is kind of the problem with starting off with a half-assed approach - developing the idea leads to more halfassedness as you try to patch up the problems caused by the short cuts you took.

    One thing is that you are creating illegal html here - copying innerHTML like that results in multiple elements with the same ID, which is problematic in itself.

    If this is a form to be submitted, I suspect that what you want is unique names for the fields, but anyway, the process is the same.

    If you're really against doing this the way it should probably be done (by using createElement like in my snippet above and adding an incrementing counter to the elements as they are created), I can think of two ways - either you run a regex on the entire innerHTML every time you copy it and add it to the table and change the IDs then OR you wait until just before the form is to be submitted, then loop through all the elements you want to give IDs to, filter them by class name and add the IDs at that point.

    Being that the first option is so crapulous it makes me sleepy just thinking about it, here's how I'd do the second:

    first, give your selects identifying class names:

    Code:
    <select class='client' name="client1">
    					<option value="1">Client 1</option>
    					<option value="2">Client 2</option>
    					<option value="3">Client 3</option>
    					<option value="4">Client 4</option>
    					<option value="5">Client 5</option>
    				</select>
    
    <select class='loc' name="location1">
    				  <option value="1">Loc 1</option>
    					<option value="2">Loc 2</option>
    					<option value="3">Loc 3</option>
    					<option value="4">Loc 4</option>
    					<option value="5">Loc 5</option>
    				</select>
    
    <select class='serial' name="serial_0_1">
    <option value="1">Serial 1</option>
    <option value="2">Serial 2</option>
    <option value="3">Serial 3</option>
    <option value="4">Serial 4</option>
    <option value="5">Serial 5</option>
    </select>
    then run this function once your table is set and you want to give them IDs (ie, best just before submitting):

    Code:
    function applyIDs(){
    var sels=document.getElementById("dataTable").getElementsByTagName("select");
    for(var x = 0; x < sels.length; x++){
    	if (sels[x].className=="client"){
    	sels[x].id="client"+x;
    	} else if (sels[x].className=="loc"){
    	sels[x].id="loc"+x;
    	} else if (sels[x].className=="serial"){
    	sels[x].id="serial"+x;
    			}	
    		}
    document.getElementById("client0").style.backgroundColor="red"//for testing purposes
    	}

  • #7
    New Coder
    Join Date
    May 2011
    Posts
    85
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Dear Xelawho,
    Actually I took this solution of adding dynamic row from a link in google which I saw many people using it so looks like that is wrong is it? I do not get what exactly is illegal sorry I am new to this process? I get pretty much your idea of function applyIDs() which I guess is best mechanism. But how about my inner table how am I going to give it an unique id and also the rows in it? I got one more problem is that I will have Remove button in the sub table so to make that function if I do not assign any id to it is that possible? Thank you.

  • #8
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,918
    Thanks
    56
    Thanked 545 Times in 542 Posts
    It depends on what your definition of wrong is.

    It works, obviously, but it's far from being the best approach, in my opinion. Finding stuff on google is no guarantee to quality - you can find many, many examples of badly written code by googling.

    Elements IDs have to be unique. And if you create an element by the method you are using you copy everything - including its ID. And then you have multiple elements with the same ID.

    But even before you do your copy routine you are doing this, in your hardcoded table - and I don't even know why, maybe it's a mistake, but have a look at this:
    Code:
    <td id="col_0_1">
    <select class='client' name="client1">
    ...
    <td id="col_0_1">
    <select class='loc' name="location1">
    two TDs, both with the same ID.

    Adding IDs later to tables, buttons, whatever, is the same routine as described in my previous post - give each element you want to assign an ID to a unique class name, then loop through those tagNames assigning the appropriate IDs.

    For your button to work, you could assign it a class name, loop through all the elements and assign those with that class an onclick handler. Or you could hardcode it the way that I did with the "delete this table" button in post number 4. Assigning an id to the button isn't going to help much if the buttons are created dynamically because you won't know which IDs exist, so you will end up having to go through the first process described above - loop through all the buttons, test their IDs and assign an onclick if they match your criteria.

  • #9
    New Coder
    Join Date
    May 2011
    Posts
    85
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Dear Xelawho,
    What I was trying to clear from you is what you mean by creating illegal html ? Yes the redundant ID is a mistake now below I have attached my latest with no id any more just class names only. Actually in the 4th column is not add another table sorry for my mistake earlier. I have modified your codes in there but my only problem now the remove button codes does not work and how to control that minimum one select must remain in that 4th column. Last I am going to use your method to update the tagID but for serial tagID how to group them by their rows else all be having a running number hope you get my point here?


    Code:
    <html>
    <head>
    	<script type="text/javascript">
    		function addRow(tableID) {
    
    			var table = document.getElementById(tableID);
    
    			var rowCount = table.rows.length;
    			var row = table.insertRow(rowCount);
    
    			var colCount = table.rows[0].cells.length;
    
    			for(var i=0; i<colCount; i++) {
    
    				var newcell	= row.insertCell(i);
    
    				newcell.innerHTML = table.rows[1].cells[i].innerHTML;
    				
    				}
    		}
    		
    		function addTable(cell){
    		cell.innerHTML+=document.getElementById("extratable").innerHTML
    		}
    
    
    		function deleteRow(tableID) {
    			try {
    			var table = document.getElementById(tableID);
    			var rowCount = table.rows.length;
    
    			for(var i=0; i<rowCount; i++) {
    				var row = table.rows[i];
    				var chkbox = row.cells[0].childNodes[0];
    				if(null != chkbox && true == chkbox.checked) {
    					if(rowCount <= 1) {
    						alert("Cannot delete all the rows.");
    						break;
    					}
    					table.deleteRow(i);
    					rowCount--;
    					i--;
    				}
    
    
    			}
    			var table = document.getElementById(tableID);
    			for (var i = 0, row; row = table.rows[i]; i++) {
    				  row.id="row"+i;
    			   //iterate through rows
    			   //rows would be accessed using the "row" variable assigned in the for loop
    			   for (var j = 0, col; col = row.cells[j]; j++) {
    			     //iterate through columns
    			     //columns would be accessed using the "col" variable assigned in the for loop
    			     //alert("J : "+j);
    			     col.id="col"+i;
    			     if(j==0)
    			     {
    			     	
    			     }
    			     else if(j==1)
    			     {
    			     	
    			    }
    			   }  
    			}
    			
    			}catch(e) {
    				alert(e);
    			}
    		}
    		
        function removeSubRow2() {
        	
        	
        }
    	</script>
    </head>
    <body>
      Begin Location : <select class='select' id="beginLocation" name="beginLocation">
    					<option value="1">Loc 1</option>
    					<option value="2">Loc 2</option>
    					<option value="3">Loc 3</option>
    					<option value="4">Loc 4</option>
    					<option value="5">Loc 5</option>
    				</select>
    				<p type="text" class=error id='beginLocation_Error'>
    	<br\>
    	<input type="button" value="Add Row" onclick="addRow('dataTable')" />
    
    	<input type="button" value="Delete Row" onclick="deleteRow('dataTable')" />
    
    	<table id="dataTable" width="350px" border="1">
    		<tr>
    			<th></th>
    			<th>Client</th>
    		  <th>Location</th>
    		  <th>Serial</th>
    		</tr>
    		
    		<tr>
    			<td ><input type="checkbox" name="chk"/></td>
    			<td >
    				<select class="clientSelect" >
    					<option value="1">Client 1</option>
    					<option value="2">Client 2</option>
    					<option value="3">Client 3</option>
    					<option value="4">Client 4</option>
    					<option value="5">Client 5</option>
    				</select><p type="text" class="clientError">				
    			</td>
    			
    			<td>
    				<select class="locSelect" >
    				  <option value="1">Loc 1</option>
    					<option value="2">Loc 2</option>
    					<option value="3">Loc 3</option>
    					<option value="4">Loc 4</option>
    					<option value="5">Loc 5</option>
    				</select>
    				<p type="text" class="locError">				
    			</td>
    			
    			<td >
    				<input type="button" value="Add Serial" onclick="addTable(this.parentNode);" />
    				<br\>
    				<table class="subTable" >
    					<tr>
    						<td>
    							<select class="serialSelect" >
    								<option value="1">Serial 1</option>
    								<option value="2">Serial 2</option>
    								<option value="3">Serial 3</option>
    								<option value="4">Serial 4</option>
    								<option value="5">Serial 5</option>
    							</select>
    					   </td>
    					   <td>
    					   	 <input type="text" class="documentName" >					   	
    					   </td>
    					   <td>
    					   	 <input type="button" class="serialRemove" value="Remove" this.parentNode.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode.parentNode)" />								
    					   </td>
    				  </tr>
    				  <tr>
    				  	 <td>
    				  	 <p type="text" class="serialError">
    				  	</td>
    				  	 <td>
    				  	 <p type="text" class="documentError">
    				  	</td>	
    				  	<td>
    				  	 
    				  	</td>
    				  </tr>
    				</table>
    				
    			</td>
    		</tr>
    	</table>
    <div id="extratable" style="display:none"> 
    	
             <tr>
    						<td>
    							<select class="serialSelect">
    								<option value="1">Serial 1</option>
    								<option value="2">Serial 2</option>
    								<option value="3">Serial 3</option>
    								<option value="4">Serial 4</option>
    								<option value="5">Serial 5</option>
    							</select>
    					   </td>
    					   <td>
    					   	 <input type="text" class="documentName" >					   	
    					   </td>
    					   <td>
    					   	 <input type="button" class="serialRemove" value="Remove" onclick="removeSubRow2(this.parentNode);" />								
    					   </td>
    				  </tr>
    				  <tr>
    				  	 <td>
    				  	 <p type="text" class="serialError">
    				  	</td>
    				  	 <td>
    				  	 <p type="text" class="documentError">
    				  	</td>	
    				  	<td>
    				  	 
    				  	</td>
    				  </tr>
    </div>	
    </body>
    </html>

  • #10
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,918
    Thanks
    56
    Thanked 545 Times in 542 Posts
    in terms of having the ID numbers match their rows you can use the rowIndex of the TR that they belong to to keep them consistent:

    Code:
    function applyIDs(){
    var sels=document.getElementById("dataTable").getElementsByTagName("select");
    for(var x = 0; x < sels.length; x++){
    	if (sels[x].className=="clientSelect"){
    	sels[x].id="client"+sels[x].parentNode.parentNode.rowIndex;
    	} else if (sels[x].className=="locSelect"){
    	sels[x].id="loc"+sels[x].parentNode.parentNode.rowIndex;
    	} else if (sels[x].className=="serialSelect"){
    	sels[x].id="serial"+sels[x].parentNode.parentNode.rowIndex;
    			}	
    		}
    document.getElementById("client1").style.backgroundColor="red"//for testing purposes
    	}

  • #11
    New Coder
    Join Date
    May 2011
    Posts
    85
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Dear Xelawho,
    I do not get you how to main the tr to the sub table's selects I am a bit blur on that. Another thing on the remove button I put this <input type="button" class="serialRemove" value="Remove" onclick="this.parentNode.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode.par entNode.parentNode)"> but it give me error saying NotFoundError: Node was not found? I want to learn about this removeChile and the parent node relationship?

  • #12
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,918
    Thanks
    56
    Thanked 545 Times in 542 Posts
    Here's a link to a very good page that explains all about the DOM, how to attach attributes, the parent/child model and also how to create elements dynamically so that you can set attributes like their ID at the time of their creation, making it easier for you in the long run. Good luck.

  • #13
    New Coder
    Join Date
    May 2011
    Posts
    85
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Dear Xewalho,
    Regarding the serial combo. I plan to do something like this does this makes sense.First I give each of the sub table and id then iterate through the tables and search for each select and give id of row_sequence ID ? What is your opinion on this?

    Code:
    var subTables=document.getElementById("dataTable").getElementsByTagName("table");
    		for(var t = 0; t < subTables.length; t++){
    			//alert("I : "+i);			
    			var st=0,ls=0;
    			if (subTables[t].className=="subTable"){
    			st++;
    			sels[t].id="subTable"+st;
    			}
    					
    		}

  • #14
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,918
    Thanks
    56
    Thanked 545 Times in 542 Posts
    I guess... have you tested it? The only thing you might have trouble with is that you are resetting st every time the loop goes around. But maybe that's what you want...

  • #15
    New Coder
    Join Date
    May 2011
    Posts
    85
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Dear Xelawho,
    No I just to this settings all in the applyIDs function ok? Thank you.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •