...

View Full Version : I like this code but I only want to create a row once



dan18088
10-17-2003, 01:24 AM
The below code will add a row everytime the user changes the option field, on any row, I would just like an additional row if the option list is changed from null to some value. I hope this makes sense, I just always want an extra row for the user to choose from the option list but if they change an option on the first row, I don't want additional rows created.


<html>
<head>
<script language="JavaScript">
<!--
var ELpntr=1;
var content1='';
var content2='<input type="text" name="text'+ELpntr+'A">';
var content3='<input type="text" name="text'+ELpntr+'B">';
var content4='<input type="text" name="text'+ELpntr+'C">';
function addRow()
{
ELpntr++;
content1='<select name="pick'+ELpntr+'" onChange="addRow()">';
content1+='<option value"" selected>Select an Employee</option>';
content1+='<option value"Option 1">Option 1</option>';
content1+='<option value"Option 2">Option 2</option></select>';
tabBody=document.getElementsByTagName("TBODY").item(0);
row=document.createElement("TR");
cell1 = document.createElement("TD");
cell2 = document.createElement("TD");
cell3 = document.createElement("TD");
cell4 = document.createElement("TD");
cell1.innerHTML=content1;
cell2.innerHTML=content2;
cell3.innerHTML=content3;
cell4.innerHTML=content4;
row.appendChild(cell1);
row.appendChild(cell2);
row.appendChild(cell3);
row.appendChild(cell4);
tabBody.appendChild(row);
}
//-->
</script>

</head>
<body>
<form>
<table border='1' id='mytable'>
<tbody>
<TR>
<TD>
<Select name="pick1" onChange="addRow()">
<option value="">Select an Employee</option>
<option value="Option 1">Option 1</option>
<option value="Option 2">Option 2</option>
</select>
</td>
<TD><input name="text1A"></TD>
<TD><input name="text1B"></TD>
<TD><input name="text1C"></TD>
</TR>

</tbody>
</table>
</form>
</body>
</html>

Kor
10-17-2003, 08:29 AM
Seemed a little bit confusing for me. Something like this?



<html>
<head>
<script language="JavaScript">
<!--
var ELpntr=1;
var content1='';
var content2='<input type="text" name="text'+ELpntr+'A">';
var content3='<input type="text" name="text'+ELpntr+'B">';
var content4='<input type="text" name="text'+ELpntr+'C">';
function addRow()
{
ELpntr++;
content1='<select name="pick'+ELpntr+'" onChange="addRow()">';
content1+='<option value"" selected>Select an Employee</option>';
content1+='<option value"Option 1">Option 1</option>';
content1+='<option value"Option 2">Option 2</option></select>';
tabBody=document.getElementsByTagName("TBODY").item(0);
row=document.createElement("TR");
cell1 = document.createElement("TD");
cell2 = document.createElement("TD");
cell3 = document.createElement("TD");
cell4 = document.createElement("TD");
cell1.innerHTML=content1;
cell2.innerHTML=content2;
cell3.innerHTML=content3;
cell4.innerHTML=content4;
row.appendChild(cell1);
row.appendChild(cell2);
row.appendChild(cell3);
row.appendChild(cell4);
tabBody.appendChild(row);
}
//-->
</script>

</head>
<body>
<form>
<table border='1' id='mytable'>
<tbody>
<TR>
<TD>
<Select name="pick2">
<option value="">Select an Employee</option>
<option value="Option 1">Option 1</option>
<option value="Option 2">Option 2</option>
</select>
<Select name="pick1" onChange="addRow()">
<option value="">Select an Employee</option>
<option value="Option 1">Option 1</option>
<option value="Option 2">Option 2</option>
</select>
</td>
<TD><input name="text1A"></TD>
<TD><input name="text1B"></TD>
<TD><input name="text1C"></TD>
</TR>

</tbody>
</table>
</form>
</body>
</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum