Thursday, October 19, 2006

MANIPULATING DATAGRIDS IN JAVASCRIPT


Manipulating DropDownLists for example, in javascript, is similar to manipulating ListBoxes. However, if we want to add/remove items to/from a DataGrid, we have to act somewhat else. A DataGrid control is rendered as a Table with several TableRows, and TableColumns.

Adding a row to a grid with 2 columns:

var lastRow = grid.rows.length;
var row = grid.insertRow(lastRow);

var cellLeft = row.insertCell(0);
var textNode = document.createTextNode("col1/rowx");
cellLeft.appendChild(textNode);

var cellRight = row.insertCell(0);
var textNode2 = document.createTextNode("col2/rowx");
cellRight.appendChild(textNode2);

Deleting a row from the same grid:

grid.deleteRow(index); // 1<= index < grid.rows.length - if the grid has a header.

No comments: