On Dec 3, 6:16 am, KenB <kenber...@gmail.com> wrote: > I am new to prototype and need to learn how to traverse an html table > and hide some columns. The only id I have is table id or the class it > is associated with. Can anyone give me an example? > > Here is what I am trying to accomplish. > > var tbl = > document.getElementById('ctl00_m_g_0ab7c148_0e6c_49e4_bc03_fd1064ca4b41_ctl00_Grid'); > > if (tbl != null){ > > var rows = tbl.getElementsByTagName('tr');
table elements have a rows property that is a collection of all the rows in the table, so no need for getElementsByTagName: var rows = tbl.rows; > var cols = rows[0].getElementsByTagName('th'); Table rows (TR) have a cells property that is a collection of all the cells in the row, so if all the cells are TRs then: var cols = rows[0].cells; > cols[0].style.width = '300px'; > cols[1].style.display = 'none'; > cols[2].style.display = 'none'; > > //Now loop through the data rows and hide specific cells > for (var row = 1; row < rows.length; row++) { > var cels = rows[row].getElementsByTagName('td'); Same here, no need for getElementsByTagName: var cels = rows[row].cells; > //alert(cels[1].valueOf); > cels[0].style.width = '300px'; > cels[1].style.display = 'none'; > cels[2].style.display = 'none'; > } > } Rather than looping over every cell in every row, consider creating col[1] or colgroup[2] elements whose purpose is to provide a mechnaism for applying styles to columns instead of each cell individually. 1. <URL: http://www.w3.org/TR/html401/struct/tables.html#edef-COL > 2. <URL: http://www.w3.org/TR/html401/struct/tables.html#edef-COLGROUP > -- Rob -- You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group. To post to this group, send email to prototype-scriptacul...@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.