Show and hide table rows, toggle table rows

Script version:1.0
Language:javascript
Rating:
3.4 (8 votes cast)
Category:Tables
Description:How to show and hide table rows in javascript / dhtml - compatible with ie, firefox, google chrome.
Instructions:nb do not use display = 'inline' in the showRow() function as this might screw up mozilla - similary, do not use display='table-row' which works for mozilla and google chrome but not IE so its best just to change it to blank as above.
Code:




Comments



Bernd
06 October 2009 01:36:32
Sorry to rate harshly, but this is Mickey Mouse and all over the web and what I'm struggling to find still is a way to toggle an arbitrary set of rows identified somehow in their tag by Id or class, not a specifically named row. How useless is that after all? Show hid A row?



Myke Black
http://www.mykeblack.com
03 November 2009 12:52:51
Another way of doing this is to use a class for the rows you want to change, then set the style of the class to display:none in response to the event. This page on my site: http://mykeblack.com/dhtml/stylerules.html shows an example of dynamically changing stylesheet rules.

Name: *
Email: (not shown on website)
Website:
Rate this script:
1 2 3 4 5 6 7 8 9 10
worse better
Comment: *
CAPTCHA Image
Change Image
Write the characters in the image above


* = required field

Related Scripts:

Change background image of td table cell

Change background colour of a table cell

Tags

[ tables ] [ hide/show ] [ rows ] [View tag cloud]

Back to main scripts page








Tag Cloud    Submit a script


Latest Scripts Added

jQuery image swap on mouseover (jQuery)
04 January 2012
This simple bit of code allows you to quickly create image rollovers. The code was modified from a version by Sam Colletts on http://webdevel.blogspot.com/2008/04/rollover-images-with-jquery.html ...

replace XML characters in a string using ASP.Net (ASP.Net)
12 December 2011
Sometimes you need to insert a string into an xml document. Before doing this, you need to ensure that your string does not contain any special xml characters. It is possible to use a CDATA section ...

How to remove title tag in ASP.Net (ASP.Net)
14 October 2011
This is not really a script, but a little trick that you can use to remove the title tag in ASP.net. In ASP.net, when the head tag is rendered, the title tag is automatically added. One of the real ...

ASP sort numerical array (ASP)
12 September 2011
This code is similar to the sort array script which sorts an array alphabetical, however it also sorts arrays based on numberical ordering, for example: dim numbers(4) numbers(0) = ...

Force file download in ASP.Net / c# (ASP.Net)
02 September 2011
this script allows you to force browsers to display a file save dialogue for any file type. It contains a string of allowed file types so users cannot change the querystring to downoad your ...