frwa's Profile User Rating: -----

frwa's Photo
Reputation: 0 Apprentice
Group:
New Members
Active Posts:
4 (0.02 per day)
Joined:
14-September 12
Profile Views:
151
Last Active:
User is offline Sep 19 2012 10:34 AM
Currently:
Offline

Previous Fields

Dream Kudos:
0
Icon   frwa has not set their status

  1. Awards
  2. About Me
  3. Blog

Posts I've Made

  1. In Topic: Adding dropdown list on a cell

    Posted 19 Sep 2012

    Dear Nullified,
    Ok to ease your understanding on my own now I could do the following ready.So if you notice each time I add a new row I can change the id of the select of 2nd and 3rd column ready. Now I am stuck for 4th column I want to change for the button the id and also the sub table. I try looping for the childNodes but the id for sub table does not come out? Maybe you can help me check my codes below?


    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;
				
				
		  }
		  
		  var rows = table.querySelectorAll('[id^=row]');
		  for (var i = 0, row; row = table.rows[i]; i++) {
				  row.id="row"+i;
				  row.name="row"+i;
				  var rowName = "row"+i;
				  for (var j = 0, col; col = row.cells[j]; j++) {
				  	 col.id="col_"+i+"_"+j;
				     col.name="col_"+i+"_"+j;
				     
				     if(j==1 && i>0)
				     {
				       //alert("TEST : "+col.childNodes[0].getElementsByTagName('select')[j]);
				       col.childNodes[0].id = "client"+i;
				       col.childNodes[0].name = "client"+i;
				       col.childNodes[2].id = "client_"+i+"_Error";
				     }
				     if(j==2 && i>0)
				     {
				       //alert("TEST : "+col.childNodes[0].getElementsByTagName('select')[j]);
				       col.childNodes[0].id = "location"+i;
				       col.childNodes[0].name = "location"+i;
				       col.childNodes[2].id = "location_"+i+"_Error";
				     }
				     if(j==3)
				     {
				     	alert("CELS : "+col.childNodes.length);
				     	
				     	//var d = document.getElementById("ID_of_parent");
              //if (d)
              //{
				        for(var c = 0; c < col.childNodes.length; c++)
				        {
				            alert("C : "+c+"   "+col.childNodes[c].nodeType+"   "+"ID IS :"+col.childNodes[c].name );
				            
				            //if (col.childNodes[c].nodeType == 1)
				            //    alert(typeof(col.childNodes[c]) + "- " + col.childNodes[c].nodeType + ": " + col.childNodes[c].tagName + " - " + col.childNodes[c].innerHTML);
				        }
              //}
				     	
				     	
				     	
				     	/*for(var c = 0; c < col.childElementCount; c++)
              {
               alert("ID : "+col.item(c).id);
              }*/
				     	//alert(col.childNodes[0].getElementsByTagName('button')[0]);
				     	
				     }
		      }
		  }
		  /*for(var i=0; i<colCount; i++) {
		  	
		  	newcell.childNodes[0].getElementsByTagName('select')[0];
		  	
		  }*/
		
		var iRowCount = table.getElementsByTagName('tr').length;
      alert('Your table has ' + iRowCount + ' rows.');
	 }

  2. In Topic: Adding dropdown list on a cell

    Posted 18 Sep 2012

    Dear Nulliefied & Jmrker,
    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.

    <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>

My Information

Member Title:
New D.I.C Head
Age:
Age Unknown
Birthday:
Birthday Unknown
Gender:

Contact Information

E-mail:
Private

Friends

frwa hasn't added any friends yet.

Comments

frwa has no profile comments yet. Why not say hello?