| Subcribe via RSS

insertRow() - inserting dynamic rows in javascript

February 13th, 2008 Posted in javascript by dreamluverz

Summary



insertRow inserts a new row in the table.

Syntax

var row = HTMLTableElement.insertRow(index);
  • HTMLTableElement is a reference to a HTML table element.
  • index is the row index of the new row.
  • row is assigned a reference to the new row.
    If index is -1 or equal to the number of rows, the row is appended as the last row. If index is omitted or greater than the number of rows, an error will result.


Example

<table id="TableA">
  <tr>
    <td>Old top row</td>
  </tr>
</table>

<script type="text/javascript">

  function addRow(tableID)
  {

    // Get a reference to the table
    var tableRef = document.getElementById(tableID);

    // Insert a row in the table at row index 0
    var newRow   = tableRef.insertRow(0);

    // Insert a cell in the row at index 0
    var newCell  = newRow.insertCell(0);

    // Append a text node to the cell
    var newText  = document.createTextNode('New top row')
    newCell.appendChild(newText);
  }

// Call addRow() with the ID of a table
addRow('TableA');

</script>
source: http://developer.mozilla.org/en/docs/DOM:table.insertRow

Leave a Reply