juststeve
asked on
Change table column size
I have a table where the user may want to hide some columns in order to provide more room. I'd like to devise a script that would let them click a given cell (in top row) and have that column collapse to a width of say, 5 px. A 2nd click to that cell would toggle the column back to the original width.
It would probably be necessary to make the text as tiny as possible and change font color to the same as the background color so the cell looks blank.
Any examples of something like this anywhere?
thankx
--steve...
It would probably be necessary to make the text as tiny as possible and change font color to the same as the background color so the cell looks blank.
Any examples of something like this anywhere?
thankx
--steve...
hm.. wasn't really finished.. and suddenly i pressed Enter on my keyboard..
.. i was saying ..
something like this:
function switchcolumnstyle(iCol){
var aTds = document.getElementsByTagN ame('TD')
for (i=0;i<aTDs.length;i++){
if (aTDs[i].id.indexOf('col'+ iCol)!=-1) {
if (aTDs[i].className=='headT D_open'){a TDs[i].cla ssName='he adTD_open' }
else{aTDs[i].className='he adTD_close d'}
}
}
}
Goodluck with it ! Tys
.. i was saying ..
something like this:
function switchcolumnstyle(iCol){
var aTds = document.getElementsByTagN
for (i=0;i<aTDs.length;i++){
if (aTDs[i].id.indexOf('col'+
if (aTDs[i].className=='headT
else{aTDs[i].className='he
}
}
}
Goodluck with it ! Tys
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Remember you can replace checkbox to a button or a link.
-Raj
-Raj
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thankx to all!
here is my idea ..
set up a table with rows and columns which have id's and classes, like this
<tr><td id=col1row1 class=headTD_open>text</td
define 2 classes , a 'open' and 'closed' version for your table cells..
start with giving the cells the blabla_open class
for the 'closed' class , set the following, background:#FFFFFF; color:#FFFFFF; overflow:hidden; width:5px;
then add onclick events to the cells in the first row, like this <td id=col1row1 class=headTD_open onclick="javascript:switch
and last but not least , create a function which takes the column parameter, and loops through the whole table , and sets the className for every row that it finds with the given column index..
something like this:
function switchcolumnstyle(iCol){
var aTds = document.getElementsByTagN
for (i=0;i<aTDs.length;i++){
}
}