Hello all,
I have a question and I'd be glad if any of you could help me :) I have written code to add rows dynamically to an existing table. When the user first comes to the page, there are 2 rows in the table already. If he so wishes, he can add additional rows. Whilst creating the rows, I have set the 'id' and 'onchange' attributes.
Now when he comes back to this page after going forward 1 page, the table is not loading with all values. Here's the problem. It only loads the first 2 rows, a.k.a, the rows which were present static in the table.
Any ideas on why is this happening, and how can I get the table to load all rows?
I have pasted relevant sections of my code below:
There's no syntactical error so I know the code is fine. Just the id on revisiting the page is messed up. Please help, I'd really appreciate it.
Thanks!
- Trupti
I have a question and I'd be glad if any of you could help me :) I have written code to add rows dynamically to an existing table. When the user first comes to the page, there are 2 rows in the table already. If he so wishes, he can add additional rows. Whilst creating the rows, I have set the 'id' and 'onchange' attributes.
Now when he comes back to this page after going forward 1 page, the table is not loading with all values. Here's the problem. It only loads the first 2 rows, a.k.a, the rows which were present static in the table.
Any ideas on why is this happening, and how can I get the table to load all rows?
I have pasted relevant sections of my code below:
Code:
/* **** Code Start **** */
/* function to add rows to the table dynamically */
function addRow(tableID) {
this.count++;
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createTextNode("Provider:");
element1.type = "text";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
var provID = document.createElement("select");
provID.setAttribute('id', ('document.circuits.providers' + (rowCount - 2)));
name = provID.setAttribute("onchange", 'provider(this);');
loadPopup (provID, Organisations, "a Circuit Provider"); //funciton to populate the select element
cell2.appendChild(provID);
alert("the id is: " + provID.id); //correctly prints document.circuits.providers1
alert("provID: " + provID); // correctly prints HTMLSelectElement
}
/* function to load the page on entry */
function loadPage ()
{
var t = "";
// it comes to this part when user comes back to this page
if ((top.providers).length > 0) {
for (i = 0; i < (top.providers).length; i++) {
var y = 'document.circuits.providers' + i;
alert("y is: " + y);
t = eval('document.circuits.providers' + i); // works with only 0
alert("now t is: " + t); //'t' prints as 'undefined'
top.providerNames[i] = top.LoadPopup (t, Organisations, "a Circuit Provider", top.providers[i]);
}
}
else { // comes to this part when user first comes to this page
// provide for one circuit provider info to be entered - user can add more if he needs
top.allProviderIDs = "";
top.allProviderNames = "";
t = eval('document.circuits.providers' + 0);
alert("t is: " + t);
top.providerNames[0] = top.LoadPopup (t, Organisations, "a Circuit Provider", top.providers[0]);
}
}
<body onload="loadPage();">
<div id="mainbody">
<form>
<table>
<!-- etc etc -->
</table>
</form>
</div>
</body>
</html>
/* **** Code End **** */
Thanks!
- Trupti
Comment