Hiding a table row is fine, just set document.getElementById(‘theRow’).style.display = ‘none’
When you’re trying to show it though, it can get confusing – for it to display properly, you’ve to set display=’table-row’ for Firefox and display=’block’ for IE.
The solution? Set display=” and the display property for the element gets set to its default (‘table-row’ for FF and ‘block’ for Explorer).
Advertisements
November 28, 2008 at 9:07 pm
that’s bloody cool! I’ve had to do that many times in the past, and each time, I did a browser-check.
thanks!
January 6, 2009 at 12:36 pm
thank you very much for a such fresh solution!
January 8, 2009 at 6:53 pm
Thanks!
Why can’t they just be the same!
February 5, 2009 at 6:46 pm
Thank you kind sir I really couldn’t be arsed with browser detection!
March 9, 2009 at 6:26 pm
Great solution! Thanks.
March 12, 2009 at 4:52 am
You’re a freaking genius. Saved me a bunch of time messing with this.
March 26, 2009 at 9:39 pm
Great man! Thanks for publishing this, perfect solution! 🙂
April 25, 2009 at 4:45 pm
I’ve been trying to solve this for two days. Your solution worked perfect to turn a table on and off and an iframe within a table.
July 23, 2009 at 6:36 pm
You have no idea how useful this is.
Thanks for posting!
September 3, 2009 at 4:05 pm
Simple and brilliant. Thanks!
September 3, 2009 at 9:54 pm
For anyone who is scratching their heads wonder why this works for everyone else and not them…. make sure you do not have a CSS display property on the row in question. Since my row was to be hidden by default, I had a CSS snippet of:
tr.hide {display:none}
For whatever reason, this defeats the blank-string-default method mentioned here (i.e. it works with an explicit “table-row”, or, poorly, with “block”, but refuses to show up again with a style.display of “”). If I do the hiding when the row is created in JS instead, ala:
tr.style.display=”none”;
the method works fine.
October 28, 2009 at 4:37 am
Thanks for the post! Awesome solution, been scratching my head over this for days.
December 14, 2009 at 10:49 pm
Thanks! This helped me squash an IE error I was getting when adding table rows with jQuery. Setting it to ‘table-row’ was working great in FF but not in IE.
December 17, 2009 at 6:58 pm
[…] https://cormacscode.wordpress.com/2008/11/28/show-hide-table-row-in-firefox-versus-ie/ […]
January 11, 2010 at 5:55 pm
Thanks for this post… great help!
P
February 22, 2010 at 10:38 pm
voila une info utile merci !
April 13, 2010 at 8:01 pm
Cool!!
Thanks a lot, really helpful!
Cheers!
May 4, 2010 at 1:32 pm
Thanks for this post, its a tip to remember!
And thanks JDS for your follow on post, that helped a lot
July 22, 2010 at 11:08 am
it works…thanks !!!!
January 19, 2011 at 9:50 pm
that’s a brilliant solution.
cheers
July 24, 2012 at 9:05 pm
+1 for me! Thanks Lots!!