hi i am new 2 this group as well as to javascript.could anybody tell me
to add double comboboxes to the dynamic added rows without deleting
previous rows.
fortunately i did for dynaming way of incrementing rows.now i need an
help on combox.
selecting item in first combobox made an corresponding changes on items
in the second combo box
here is my coding:
<html>
<form name="frmdesilt">
<head>
<title>Insert Table Row using DOM</title>
<script language="javascript">
function addRow()
{
var tbody =
document.getElementById("table1").getElementsByTag Name("tbody")[0];
var row = document.createElement("TR");
var cell1 = document.createElement("TD");
var inp1 = document.createElement("INPUT");
var combo1=document.createElement("select");
var combo11=document.createElement("option");
var combo12=document.createElement("option");
var combo2=document.createElement("select");
var combo21=document.createElement("option");
var combo22=document.createElement("option");
var inp2=document.createElement("INPUT");
var inp3=document.createElement("INPUT");
inp2.setAttribute("type","text");
inp2.setAttribute("value","no");
inp2.setAttribute("size","3");
inp3.setAttribute("type","text");
inp3.setAttribute("value","amount");
inp3.setAttribute("size","7");
combo1.setAttribute("name","cmbgroup");
combo1.setAttribute("onChange","redirect(this.opti ons.selectedIndex");
combo11.setAttribute("value","usa1");
combo11.innerHTML="india--";
combo12.setAttribute("value","india1");
combo12.innerHTML ="usa--";
combo2.setAttribute("name","cmbitem");
combo21.setAttribute("value","alaska");
combo21.innerHTML="alaska--";
combo22.setAttribute("value","chennai");
combo22.innerHTML="chennai";
combo1.appendChild(combo11);
combo1.appendChild(combo12);
combo2.appendChild(combo21);
combo2.appendChild(combo22);
var cell2 = document.createElement("TD");
cell2.appendChild(combo1);
var cell3 = document.createElement("TD");
cell3.appendChild(combo2);
var cell4 = document.createElement("TD");
cell4.appendChild(inp2);
var cell5 = document.createElement("TD");
cell5.appendChild(inp3);
row.appendChild(cell2);
row.appendChild(cell3);
row.appendChild(cell4);
row.appendChild(cell5);
tbody.appendChild(row);
}
var hgroups=document.frmdesilt.cmbgroup.options.length
//document.write(groups);
var group1=new Array(hgroups)
for (i=0; i<hgroups; i++)
group1[i]=new Array()
group1[0][0]=new Option(" ")
group1[0][1]=new Option("News.com")
group1[0][2]=new Option("Wired News")
group1[1][0]=new Option("CNN")
group1[1][1]=new Option("ABC News")
/*group[2][0]=new Option("Hotbot")
group[2][1]=new Option("Infoseek")
group[2][2]=new Option("Excite")
group[2][3]=new Option("Lycos")*/
var temp=document.frmdesilt.cmbitem
function redirect(x){
/*for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null*/
for (i=0;i<group1[x].length;i++){
temp.options[i]=new Option(group1[x][i].text)
}
temp.options[0].selected=true
}
</script>
</head>
<body>
<input type="button" value="AddGroup" size="-4" onClick="addRow();">
<input type="button" value="Add Item" size="0" onClick="addRow();">
<table id="table1">
<tbody>
<tr>
<th>Group-name</th>
<th>Item-Name</th>
<th>Number</th>
<th>Amount</th>
</tr>
<tr>
<td><select name="group">
<option>india--</option>
<option>usa</option>
</select>
</td>
<td><select name="item">
<option>alaska--</option>
</select>
</td>
<td>
<input type="text" size="3">
</td>
<td>
<input type="text" size="7">
</td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
