Firefox and divs??

SlicedBread

05-09-2006, 05:09 PM

I have a page (I've pasted a simplified version of the long page) where users click to show a certain bit of info and in IE the div shows fine - but in FF it remains hidden. Does FF need any special code to show a div?

Thanks in advance
Amy
--------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<link rel="stylesheet" type="text/css" href="SSIstylesFF.css" rel="stylesheet">
<script>
var isNS6=navigator.userAgent.indexOf("Gecko")!=-1?true:false;
var isIE=document.all?true:false;
function showhideinline(oDiv,flag){
if(isIE)
{
if (flag) oDiv.style.display="inline" //if flag true - show the div
else oDiv.style.display="none"
}
else if(isNS6)
{
if (flag) document.getElementById("oDiv").style.display="inline" //if flag true - show the div
else document.getElementById("oDiv").style.display="none"
}
}
</script>
</HEAD>
<style>
.tag{background:#ffffff;width:100%;display:none}
</style>

<body>
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td>
<TABLE width="100%" cellSpacing="1" cellPadding="1" border="0">
<TR>
<TD class="NormalBold">Account Selections:</TD>
<TD><select name="BillToGrid1:lstSelectionLists" id="BillToGrid1_lstSelectionLists">
<option selected value="-5">Account I am logged into</option>
<option value="-1">My Accounts</option>
</select></TD>
<TD class="Normal" width="160">   <input type="checkbox" onclick="showhideinline(b,this.checked)">Show Selected Accounts</TD>
<TD class="Normal" width="130"></TD>
<TD class="Normal"> </TD>
</TR>
</TABLE>
</td>
<td class="Normal" noWrap align="right" valign="middle"></td>
</tr>
</table>
<div id="b" class="tag">
<TABLE cellSpacing="0" width="100%" cellPadding="0" border="2">
<TR>
<TD>
<TABLE cellSpacing="0" width="100%" cellPadding="0" border="0">
<tr>
<td>
<table cellSpacing="0" width="100%" cellPadding="0" border="1" class="tableheader6">
<tr>
<td width="40%" align="left">Account Name</td>
<td width="15%" align="left">Number</td>
<td width="25%" align="left">Address</td>
<td width="15%" align="left">City</td>
<td width="2%" align="left">State</td>
<td width="3%" align="left">Country</td>
</tr>
</table>
</td>
</tr>
</TABLE>
</TD>
</TR>

</TABLE>
</div>

</body>
</html>

jscheuer1

05-09-2006, 05:35 PM

Use this script:

<script>
function showhideinline(oDiv,flag){
if(document.all)
{
if (flag) document.all[oDiv].style.display="inline" //if flag true - show the div
else document.all[oDiv].style.display="none"
}
else if(document.getElementById)
{
if (flag) document.getElementById(oDiv).style.display="inline" //if flag true - show the div
else document.getElementById(oDiv).style.display="none"
}
}
</script>

Call it this way:

<input type="checkbox" onclick="showhideinline('b',this.checked)">

Bill Posters

05-09-2006, 05:45 PM

Why bother sniffing for document.all?
How far back do you want to support IE?

<style type="text/css">

#b {
background: #fff;
width: 100%;
}

.hide {
display: none;
}

</style>
<script type="text/javascript">

function showhideinline(oDiv,flag){

document.getElementById(oDiv).className = (flag == true) ? '' : 'hide';

}

</script>
...

<input type="checkbox" onclick="showhideinline('b',this.checked)">...

...

<div id="b" class="hide">
...
</div>

It's increasingly seen as better practice to keep structure, presentation and behaviour separate. This means avoiding manipulating an element's style properties directly, instead using js to change the class (className) and setting how that class should be styled in the stylesheet along with the other presentational rules.

SlicedBread

05-09-2006, 05:46 PM

John - Thank you so much it worked perfectly!!!!!! Now all of my divs show and hide as like I want them to.
Thanks again!!!
Amy

The Ace

05-10-2006, 12:58 AM

Am I the only one who noticed that in the else if(isNS6) version the call for the hidden elemnt is getElementById("oDiv") i.e. calling for the element that has the ID of oDiv and it's not searching for the OBJECT oDiv that is passed to the function?
that's what coused the error I presume...

jscheuer1

05-10-2006, 04:55 AM