Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations gkittelson on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Javascript div visibility working in FF not at all in IE 1

Status
Not open for further replies.
barter

barter

Programmer
Jun 19, 2008
4
US
Hello people,

I need some help, I have been unable to get this resolved in searching, in other forums, or anywhere. Some one please help!

This code works great in FF but doesn't at all in IE. In IE I get a generic "object expected" error which is most unhelpful.

What I am trying to do is customize my form a bit. I have a select with 6 options, each of which, when picked, bring up a slave select. Now this code already does what it is supposed to do, which is get the last one selected and not any of the other ones that may have been selected while the user was browsing. That is a requirement so I can not mess with that.

ok here is the code:

In the header we have:

<script type="text/javascript">
<!--
function toggle_visibility(id) {
var f = document.getElementById('cou1');
var g = document.getElementById('cou2');
var h = document.getElementById('cou3');
var i = document.getElementById('cou4');
var j = document.getElementById('cou5');
var k = document.getElementById('cou6');

var e = document.getElementById(id);

f.style.display = 'none';

g.style.display = 'none';

h.style.display = 'none';

i.style.display = 'none';

j.style.display = 'none';

k.style.display = 'none';


f.getElementsByTagName("select")[0].selectedIndex = 0;
g.getElementsByTagName("select")[0].selectedIndex = 0;
h.getElementsByTagName("select")[0].selectedIndex = 0;
i.getElementsByTagName("select")[0].selectedIndex = 0;
j.getElementsByTagName("select")[0].selectedIndex = 0;
k.getElementsByTagName("select")[0].selectedIndex = 0;

if(e.style.display == 'block') {
e.style.display = 'none';
}
else {
e.style.display = 'block';
}
}
//-->
</script>

In the body tag we have:

onload="toggle_visibility(id)"


The master select is:

<option value="6" Selected>No Bus Pick Up Needed</option>
<option value="2" onclick="toggle_visibility('cou1')">location1</option>
<option value="3" onclick="toggle_visibility('cou2')">location2</option>
<option value="4" onclick="toggle_visibility('cou3')">location3</option>
<option value="19" onclick="toggle_visibility('cou4')">location4</option>
<option value="20" onclick="toggle_visibility('cou5')">location5</option>
<option value="21" onclick="toggle_visibility('cou6')">location6</option>
</SELECT>
(BTW, onchange makes it worse. It doesn't work in FF with that)

ok, and now the slave divs.....

<div style="display:none;" id="cou0"> </div>

<div style="display:none;" id="cou1"><p><select name="specific_area"><option value="" Selected></option><option value="value">20 or so options</option></p></div>

<div style="display:none;" id="cou2"><p><select name="specific_area"><option value="" Selected></option><option value="value">20 or so options</option></p></div>

<div style="display:none;" id="cou3"><p><select name="specific_area"><option value="" Selected></option><option value="value">20 or so options</option></p></div>
<div style="display:none;" id="cou3"><p><select name="specific_area"><option value="" Selected></option><option value="value">20 or so options</option></p></div>
<div style="display:none;" id="cou4"><p><select name="specific_area"><option value="" Selected></option><option value="value">20 or so options</option></p></div>
<div style="display:none;" id="cou5"><p><select name="specific_area"><option value="" Selected></option><option value="value">20 or so options</option></p></div>
<div style="display:none;" id="cou6"><p><select name="specific_area"><option value="" Selected></option><option value="value">20 or so options</option></p></div>

end coding

I think I have it all in there. I have spent 2 weeks working on this off and on. Like I said, it works beautifully in FF but not at all in IE. I have researched and tested and then researched and tested and did researched and tested. I think I have done every conceivable option. I hate IE.

If there is a totally different way of doing this, I'm open.

Thanks for looking.

Barter
 
Sort by date Sort by votes
You said:
(BTW, onchange makes it worse. It doesn't work in FF with that)
Click to expand...

Is that with "onchange" on the select element, or on the option elements? If the latter, then you should try putting it on the select element instead.

Personally, I'd put "onchange" on the select element and remove the "onclick"s from the options, as that is the right thing to do, and then try and fix from there (perhaps make that change and post a URL to an online version of the whole page?)

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
Upvote 0 Downvote
I have tried that. I am not sure how to get the variable identified that way. I'm a javascript newbie and am thoroughly confused!

<select name="bus_area" onchange="toggle_visibility(id)">

With this I removed the onclicks from the options. All other code is the same.

BTW, the client does not want anyone to see the entire page at this point. If he finds out, I get canned. If you need more code let me know. I will look into removing some of the personal stuff and perhaps post it somewhere where you all can find it.

Barter.

 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
592
lexer
lexer
Mike Lewis
  • Locked
  • Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid) 1
Replies
5
Views
1K
Mike Lewis
Mike Lewis
TheLazyPig
  • Question
Buttons not aligned after another button is clicked
Replies
2
Views
155
gmmastros
gmmastros
JScannell
  • Locked
  • Question
Javascript events
Replies
1
Views
245
Daniel K
Daniel K
jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
664
xwb
xwb

Part and Inventory Search

Sponsor

Back
Top