Monday, March 26, 2012

Hide Columns in Table

To hide or show table columns, first we get a reference to the table
var table = document.getElementsByTagName("table")[0];
Then we get a reference to the rows collection:
var rows = table.rows;
Let's say we want to hide the first column in the table. We iterate through each row and set the display property of the first element in the cells collection to none.
for(var i=0; i< rows.length; i++){
 rows[i].cells[0].style.display='none';
}
To show a particular column, we would set the display property to blank.
for(var i=0; i< rows.length; i++){
 rows[i].cells[0].style.display='';
}

No comments:

Post a Comment