So I'm trying to work on a JavaScript function that will do what I said in the title. I assume the skeleton of it will be something like:
function createInputTable(divID, tableID, rows, cols)
{
var T = document.createElement('table id="'+tableID+'"');
// ... Do some stuff ...
document.getElementById(divID).appendChild(T);
}
Now I just need to figure out what goes in the // ... Do some stuff ...
.
From what I understand, appendChild(n)
finds the "lowest" child node and adds a node n
"below" it. Since my table consists of children that are rows, which have children that are columns, each of which has 1 child that is an input cell, I should have a loop like the following.
for (var i = 0; i < rows; ++i)
{
var thisRow = document.createElement("tr");
for (var j = 0; j < cols; ++j)
{
var thisCol = document.createElement("td");
var thisCell = document.createElement('input type="text"');
thisCol.appendChild(thisCell);
thisRow.appendChild(thisRow);
}
document.getElementById.appendChild(thisRow);
}
Or not. I'm wondering whether my understanding is correct and, if not, what I need to fix.