By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,379 Members | 1,881 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,379 IT Pros & Developers. It's quick & easy.

Show hide row in netscape using javascript

P: n/a
Hi,

The following code to show and hide a row works fine in netscape 7 and
IE 6. But everytime the cell is hidden and displayed in netscape, it
adds a new line inside the cell. Please advise.
----snip----
<html>
<head>
<title>Table hide</title>
<script language="javascript">
function flipCell(count){
f=document.getElementById("mcell");
f.style.display=(f.style.display=="block")?"none": "block";
}
</script>
</head>
<body>
<a href="javascript:flipCell(0)">here</a>

<table cellpadding="0" cellspacing="0" border="1" width="95%">
<tr>
<td>Column 1</td>
</tr>
<tr id="mcell" style="display: block;">
<td>Column 2</td>
</tr>
</table>
John Doe
</body>
</html>
---snip---
Thanks in advance,

-Tom
Jul 20 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
Bagbourne" <th************@btinternet.com> wrote in message
news:bd**********@sparta.btinternet.com...
"Thomas Abraham" <th*******@hotmail.com> wrote in message
news:5c**************************@posting.google.c om...
Hi,

The following code to show and hide a row works fine in netscape 7 and
IE 6. But everytime the cell is hidden and displayed in netscape, it
adds a new line inside the cell. Please advise.


Is it essential that you use a table? Could you use a series of DIVs?


This seems to work (tested on Opera, IE5, NS 6.2):

<html>
<head>
<title>Table hide</title>
<script language="javascript">
showRow = (navigator.appName.indexOf("Internet Explorer") != -1) ? "block" :
"table-row";
function flipCell(count)
{
f = document.getElementById("mcell");
f.style.display = (f.style.display == "none") ? showRow : "none";
}
</script>
</head>
<body>
<a href="javascript:flipCell(0)">here</a>

<table cellpadding="0" cellspacing="0" border="1" width="95%">
<tr>
<td>Column 1</td>
</tr>
<tr id="mcell">
<td>Column 2</td>
</tr>
</table>
John Doe
</body>
</html>

Nige
Jul 20 '05 #2

P: n/a
"Nigel White" <Ni********@bagbourne.freeserve.co.uk> wrote in message
news:bd*********@news7.svr.pol.co.uk...
<snip>
This seems to work (tested on Opera, IE5, NS 6.2):

<html>
<head>
<title>Table hide</title>
<script language="javascript">
showRow = (navigator.appName.indexOf("Internet Explorer") != -1) ?
"block" : "table-row";
The problem with this is that there is no relationship between the
navigator.appName property and the default CSS display property for a
table row. Opera might take either option in this test based on user
settings and other browsers that habitually spoof IE may have
implemented the "table-row" CSS property.

Fortunately the decision does not have to be made as it appears to be
the case that browsers will take the setting of the display property to
an empty string as equivalent to setting the property to the default
value for that element, whatever that default value is.
function flipCell(count)
{
f = document.getElementById("mcell");
f.style.display = (f.style.display == "none") ? showRow : "none";
So:-

f.style.display = (f.style.display == "none") ? "" : "none";
}
</script>
</head>
<body>
<a href="javascript:flipCell(0)">here</a>

<snip>

The use of the javascript pseudo-protocol is ill advised as its use
causes numerous unexpected and undesirable effects, some of which are
browser, browser version and/or operating system dependent and thus
difficult to identify:-

<URL: http://jibbering.com/faq/#FAQ4_24 >

Richard.

--

Example JavaScript DOM listings for: Opera 7.11,
Mozilla 1.2 and ICEbrowser 5.4
<URL: http://www.litotes.demon.co.uk/dom_root.html >
Jul 20 '05 #3

P: n/a
Works perfectly! Thanks.
"Nigel White" <Ni********@bagbourne.freeserve.co.uk> wrote in message news:<bd*********@news7.svr.pol.co.uk>...
Bagbourne" <th************@btinternet.com> wrote in message
news:bd**********@sparta.btinternet.com...
"Thomas Abraham" <th*******@hotmail.com> wrote in message
news:5c**************************@posting.google.c om...
Hi,

The following code to show and hide a row works fine in netscape 7 and
IE 6. But everytime the cell is hidden and displayed in netscape, it
adds a new line inside the cell. Please advise.


Is it essential that you use a table? Could you use a series of DIVs?


This seems to work (tested on Opera, IE5, NS 6.2):

<html>
<head>
<title>Table hide</title>
<script language="javascript">
showRow = (navigator.appName.indexOf("Internet Explorer") != -1) ? "block" :
"table-row";
function flipCell(count)
{
f = document.getElementById("mcell");
f.style.display = (f.style.display == "none") ? showRow : "none";
}
</script>
</head>
<body>
<a href="javascript:flipCell(0)">here</a>

<table cellpadding="0" cellspacing="0" border="1" width="95%">
<tr>
<td>Column 1</td>
</tr>
<tr id="mcell">
<td>Column 2</td>
</tr>
</table>
John Doe
</body>
</html>

Nige

Jul 20 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.