I'm trying to develop a JS function that creates a new row each time a new record is added to a database (from a different program that checks periodically). Right now I can get the function to check the db, add the record to the table and display it dynamically. The first column is the user id and the second column is where I'm running into issues. I would like to include a dropdown, but I'm not sure how to add options to it. I have the dropdown in the second column, but there are no options to choose from. Anyone have some suggestions?
function addRow(tableID, user) {
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 opt = document.createElement("option");
tabbody=document.getElementsByTagName("tbody").item(2);
cell1 = document.createElement("TD");
cell2 = document.createElement("TD");
textnode1=document.createTextNode(user);
//textnode2=document.createTextNode("morecontent");
textnode2=document.createElement("select");
textnode2.setAttribute('id', 'focus');
textnode2.options.add(opt);
cell1.appendChild(textnode1);
cell2.appendChild(textnode2);
row.appendChild(cell1);
row.appendChild(cell2);
tabbody.appendChild(row);
var newcell = row.insertCell(i);
newcell.innerHTML = table.rows[0].cells[i].innerHTML;
Here is the HTML that it is sent to:
<th colspan="2">Pending Alerts</th>
<tr>
<th>User</th>
<th>Action</th>
</tr>
<tbody>
</tbody>
After
textnode2 = document.createElement("select");
you need to do something like
var op = new Option();
op.value = 1;
op.text = "First entry";
textnode2.options.add(op);
and repeat for your desired entries.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With