I have the following code and HTML to append a row to a table. In addition to appending the row I would like to increment the segment number by one but I cannot figure out how to do that. Can anyone help? MORE IMPORTANTLY, can you also tell me where I would go to find the answer to my question in the JavaScript documentation?
code snippet :
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
if(rowCount < 10){ // limit the user from creating too many segments
var row = table.insertRow(rowCount);
var colCount = table.rows[0].cells.length;
for(var i=0; i<colCount; i++) {
var newcell = row.insertCell(i);
newcell.innerHTML = table.rows[0].cells[i].innerHTML;
}
// Increment value of Segment by 1
}else{
alert("Maximum Number of Segments is 10.");
}
}
<h1>Table Example
<input type="button" value="Append Segment" onClick="addRow('dataTable')" />
</h1>
<table id="dataTable">
<tbody>
<td><input type="checkbox" id="chk[]" unchecked></td>
<td><label>Segment: </label></td>
<td><input type="text" id="segment[]" value ="1"></td>
<td><label>Direction: </label></td>
<td><select id="direction[]">
<option>...</option>
<option>Horizontal</option>
<option>Vertical</option>
</select></td>
</tbody>
</table>
See Question&Answers more detail:os