Trouble with getElementByID for Select (Drop Down) Form

ggordon · Apr 22, 2004

I had a drop down (select) form (to send a user to a URL based on their selection) that was working perfectly fine for HTML Transitional.

Now I have to have it working using getElementByID since XHTML (Strict) doesn't allow for "name." I need to use "id" when identifying form elements.

So, .. I have this .. and I don't know how to get this coded properly so it will work in Netscape 4.79. If anyone could shed some specific light on what I need to change so it will work .. I'd greatly appreciate it.

Previous (using NAME for the form elements):

<input type="button" onClick="location=document.jump.menu.options[document.jump.menu.selectedIndex].value;" value="GO">");

Now ... I have everything basically the same .. but need to know how to recode this using getElementById so it will work.

I changed the tags in the Select form from "name=" to "id=" .. and tried ...

<input type="button" onClick="location=document.getElementById('jump').menu.options[document.getElementById('jump').menu.selectedIndex].value;" value="GO">");

This did not work.

I hope someone can tell me what to do.

If you need more details on the form, please let me know.

Thanks ...
Gary

kaht · Apr 22, 2004

From the looks of your old button, the name of the form is jump. You want to access the menu, not the form. Change the line to this:

<input type="button" onClick="location=document.getElementById('menu').options[document.getElementById('menu').selectedIndex].value;" value="GO">

-kaht

ggordon · Apr 22, 2004

kaht,

Well .. the form is brought in through a .js file.

On the HTML page, there's a:

<div id="njcuheader_jumpto">
<form id="jump" action="">
<script ....>
</form>
</div>

So, the form (inside the script .. has an ID set to menu.

But .. there are these other elements on the HTML page, before we get to the actual form (inside the .js file).

So, I tried what you said but it didn't work. My guess is it is my fault for not including the above info in my original post.

With this info now shown ... would or should I need to change anything to allow for the:

<div id="njcuheader_jumpto">
<form id="jump" action="">

???

Help?

By the way .. THANKS for trying to help so quickly. This is driving me nuts.

Gary

kaht · Apr 22, 2004

I'm not sure exactly how the structure of your page is set up.... but when using getElementById you don't need to make any references to a form. I'm pretty sure it just scans the page for any matching id (could someone correct me on this if I'm wrong?)

Here's a small working example to help you out, maybe you can incorporate this into your page:

Code:

<script language=JavaScript>
function alertValues() {
   ddBox = document.getElementById('blahSelect');
   txt = ddBox[ddBox.selectedIndex].text;
   val = ddBox.value;
   alert("Text: " + txt + "\nValue: " + val);
}
</script>
<body>
<form id=blahForm>
<select id=blahSelect onchange='alertValues()'>
<option></option>
<option value=1>One</option>
<option value=2>Two</option>
<option value=3>Three</option>
<option value=4>Four</option>
<option value=5>Five</option>
</select>
</form>
</body>

-kaht

ggordon · Apr 22, 2004

kaht,

It is really weird.

Your info works in IE 6, but I'm getting a javascript error when using Netscape 4.79.

If you would .. look at the page at:

http://www.njcu.edu/dept/its/newwebsite/

and look at it in Netscape 4.79 (or equiv.) and you'll see Javascript error: Type 'javascript' .... details

So .. my problem is .. I am trying to get this to work in Netscape 4*, yet be XHTML Strict.

Can you help??
Gary

(I am so sad at the moment.)

kaht · Apr 22, 2004

I'm sorry..... before I got my "real job" 8 months ago I had never even looked at javascript. Since I'm on an intranet, I know all of our users use IE so I've never had to mess with cross-platformability.

-kaht

adam0101 · Apr 23, 2004

Netscape 4.x doesn't support getElementById(). So it sounds like you have to either forget about later versions of Netscape, or not use *STRICT*. Sorry.

Adam
while(ignorance){perpetuate(violence,fear,hatred);life=life-1};

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!

Trouble with getElementByID for Select (Drop Down) Form

ggordon

Programmer

kaht

Programmer

ggordon

Programmer

kaht

Programmer

ggordon

Programmer

kaht

Programmer

adam0101

Programmer

Similar threads

Part and Inventory Search

Sponsor