How to hide column in table

[Don Grover]

I have a HTML table created using ASP as a web page.

ie.

HEADING1 HEADING2 HEADING3 etc...
data 1 data2 data3 etc
and so on

How can I toggle hide / show the columns individually, anyone ever needed to
do this and have any suggestions.



Regards
Don

 

[Erwin Moller]

I have a HTML table created using ASP as a web page.

ie.

HEADING1 HEADING2 HEADING3 etc...
data 1 data2 data3 etc
and so on

How can I toggle hide / show the columns individually, anyone ever needed
to do this and have any suggestions.



Regards
Don

Hi Don,

Just make some switch or if/then construct to decide if you should output a
column.

You'll get something like:

suppose col1, col2, etc contain 'on' or 'off', depending on the fact if you
want to show them. (You didn't specify how that should work, so you'll have
to cook up that part yourself.)

.... looping here over the rows ....

<tr>
<%
IF (col1='on') THEN
%>
<td>
I have value <%= putithere %>
</td>
<%
END IF
%>
</tr>

...... looping over the rows....


And do that for every column.
If you have a zillion column you better put the logic in an array and make
the code smarter.


Very possible I made some languagemistakes. My ASP got very rusty after I
started using PHP.

Regards,
Erwin Moller

 

[DJ WIce]

: > HEADING1 HEADING2 HEADING3 etc...
: > data 1 data2 data3 etc
: > and so on
: >
: > How can I toggle hide / show the columns individually, anyone ever
needed
: > to do this and have any suggestions.

Set the style of the collom to be disabled to:
style='display:none;'
And when it may appear again:
style='display:block;'

You can loop over the table and take each 3rd (for example something like):

var RowNumber = 3;
var Elements = document.getElementByID('tableID').getElementByTag('TD');
for (i=RowNumber-1;i<Elements.length;i=i+RowNumber)
{
Elements.style='display:none;'
}

You can built in a switch to test the current display style and change it to
block if it's none also.

Wouter

 

[Thomas 'PointedEars' Lahn]

Set the style of the collom to be disabled to:
style='display:none;'
And when it may appear again:
style='display:block;'

"style" refers to object, according to the W3C-DOM Level 2 Style
Specification, and the TD elements initial value for the CSS
"display" property is "table-cell", not "block". Thus it should
be

style.display = "none";

and

style.display = "table-cell";

Else it will only work in non-standards-compliant UAs, if that.


PointedEars

P.S.: Your "From" header is borken.

 

[Randy Webb]

DU wrote:

http://www10.brinkster.com/doctorunclear/HTMLJavascriptCSS/TableColumnCollapse.html

I'm still working on that file so I don't want to hear nitpicking comments.

No nitpicking - its great so far. Can you post back when its finished?
I noticed two things (probably nitpicky) but want to wait until its
finished.


Also, any chance of you re-uploading the ScrollingTableInMSIE.html file?

I have hunted it for 4 days now and finally found it in the archive.org
site:

<URL:
http://web.archive.org/web/20030608...r/HTMLJavascriptCSS/ScrollingTableInMSIE.html
/>

Or, do you mind me using it for a demo page with credit given?

 

[DU]

"style" refers to object, according to the W3C-DOM Level 2 Style
Specification, and the TD elements initial value for the CSS
"display" property is "table-cell", not "block".

According to the W3C-DOM Level 2 Style Specification, the <col> element
initial value for the CSS "display" property is "table-column", not
"block" and not "table-cell". Now, the subject line was about column in
table...

Thus it should

be

style.display = "none";

and

style.display = "table-cell";


Else it will only work in non-standards-compliant UAs, if that.


PointedEars

P.S.: Your "From" header is borken.

and if
style.display = "table-column";
does not work in MSIE 6 for Windows, then you can use
style.display = "block";
so that the code will work for roughly 60% of all web users out there
(that's just a little bit more than a few hundreds of millions of people
on this planet) ... until MSIE 7 for Windows correct all this.

According to
http://www.quirksmode.org/css/contents.html
and
http://www.quirksmode.org/css/display.html#table
display:table-column
is not supported by MSIE 5+ nor Mozilla 1.4.

Nevertheless, one can code to workaround all these difficulties. Here's
a page (local version without brinkster banner ads will validate
perfectly) which will work overall rather well in Mozilla 1.6, Opera
7.50 PR1 build 3494, MSIE 6 for Windows, K-meleon 0.8.2, NS 7.1,
Firebird 0.8+ (build 20040120), MyIE2 vers. 0.9.12 with Gecko 1.5:

http://www10.brinkster.com/doctorunclear/HTMLJavascriptCSS/TableColumnCollapse.html

Modifying the table column structure *and* the table row structure at
the same time will not produce correct layout. But if the user only
tries to modify either only the column structure or only the row
structure, then the layout will be correct. I still need to tweak the
code and tune a few things in the functions to make it more robust. I'm
still working on that file so I don't want to hear nitpicking comments.

I have another demo page where one can show, hide or collapse table
sections like the thead, tbody and tfoot.

Pointed ears, you could have replied in a much more constructive manner.
Again, you focus on little things which can only annoy others or
contribute/lead to clashing <plonk> noises.

DU

 

[DU]

DU wrote:








No nitpicking - its great so far. Can you post back when its finished?
I noticed two things (probably nitpicky) but want to wait until its
finished.


Also, any chance of you re-uploading the ScrollingTableInMSIE.html file?

Nope. That was a first draft, first version of the file. Once I was
satisfied with my latest version and could not see how I could further
tune it or improve it, then I *renamed* it and removed
ScrollingTableInMSIE.html

Now, that file is now:

http://www10.brinkster.com/doctorunclear/HTMLJavascriptCSS/ScrollingTBody.html

and will (should?) work accordingly with NS 7.1, Mozilla 1.3+,
Opera 7.x, MSIE 6, etc.

I have hunted it for 4 days now and finally found it in the archive.org
site:

<URL:
http://web.archive.org/web/20030608...r/HTMLJavascriptCSS/ScrollingTableInMSIE.html
/>

Or, do you mind me using it for a demo page with credit given?

...with credit given, ok, no problem. Thanks for asking. I appreciate
good ethics in such situation.

DU

 

[DU]

Randy Webb wrote:

Also, any chance of you re-uploading the ScrollingTableInMSIE.html file?

I have hunted it for 4 days now and finally found it in the archive.org
site:

<URL:
http://web.archive.org/web/20030608...r/HTMLJavascriptCSS/ScrollingTableInMSIE.html
/>

Or, do you mind me using it for a demo page with credit given?

The best thing you can do about scrolling tbody is to ask, demand
browsers to support it without any need of javascript or complex hacks.
Scrolling tbody is quite useful, you know.
I personally filed bug 123296 at Opera's Bug Tracking Database on this.
So if you want to support a permanent, reliable, real cross-browser
solution, then log into opera.general and/or opera.wishlist and/or
opera.page-authoring and demand that Opera supports overflow:auto on
defined tbody length.

See #4 here and the included reference to the W3C HTML 4.01

http://www10.brinkster.com/doctorunclear/BrowserBugsSection/Opera7Bugs/Opera7Bugs.html

"(...) This division [THEAD, TFOOT and TBODY elements] enables user
agents to support scrolling of table bodies independently of the table
head and foot."

HTML 4.01 11.2.3 Row groups: the THEAD, TFOOT, and TBODY elements

I filed the same bug for MSIE 6 in that corresponding section.

DU

 

[DJ WIce]

: P.S.: Your "From" header is borken.
To avoid "Someone have replied to your message" from some website that
copies this archieve.

Wouter

 

[Thomas 'PointedEars' Lahn]

: P.S.: Your "From" header is borken.
To avoid "Someone have replied to your message"
from some website that copies this archieve.

That's your problem. Use filters.

<http://www.interhack.net/pubs/munging-harmful/>


PointedEars