Changing selected index of dropdown

Forum Moderators: open

Message Too Old, No Replies

Changing selected index of dropdown

Using an innerHTML to change dropdown selected index

Seachmall

2:19 pm on Oct 31, 2007 (gmt 0)

I'm trying to change the selected index of a drop down menu based on the value of a <span> tag but it doesn't work for me. I might be going about this entirely the wrong way so I thought I'd check. Heres what I have at the moment


switch(name){ case "John": jsidvalue=0; break; case "Jack": jsidvalue=1; break; } formElements.elements[i].selectedIndex = jsidvalue;

'name' is the value of the innerHTML.

Its part of a loop that updates the entire form based on innerHTML of <span>s. All the input boxes update but drop downs don't.

Fotiman

2:58 pm on Oct 31, 2007 (gmt 0)

Welcome.
When posting your code, try to format it a little more nicely (instead of 1 run-on line). You will probably get more help.
In your example, are you sure that the value of name matches "John" or "Jack"? Try this:


alert("Find #" + name + "#"); 
switch(name){  
  case "John":  
    jsidvalue=0; 
    break; 
  case "Jack":  
    jsidvalue=1;  
    break; 
} 
alert("jsidvalue = " + jsidvalue); 
formElements.elements[i].selectedIndex = jsidvalue;

Note, I've surrounded the value of name with #, just so you can see where the actual value begins and ends.

Seachmall

4:41 pm on Oct 31, 2007 (gmt 0)

Sorry about the code run on. I'm pretty sure I threw code tags around it.

I tested it and found my problem.

I was testing the wrong form field :P.

So obvious...

Seachmall

5:25 pm on Oct 31, 2007 (gmt 0)

I have another question which relates to this, sort of.

How do you scan through the options of a drop down? Would you look for the option tags of the 5th, 6th 7th etc element of the form?

XtendScott

5:46 pm on Oct 31, 2007 (gmt 0)

myFormElem = document.FormName.FormElem;
for(var i = 0; i < myFormElem .options.length; i++) // cycle through the object list
{
if(myFormElem.options[i].selected == true){
// do stuff here
}
};

That should get you started

Seachmall

7:15 pm on Oct 31, 2007 (gmt 0)

Brilliant. Thanks, I'll try it out now.

Seachmall

8:58 pm on Oct 31, 2007 (gmt 0)

I keep getting an error saying that my form has no properties.

Should I have the name of the form as <form name="formName"> or as <form id="formName">?

Heres what I have:


document.formName.formElemnt;<form id="formName">
  <select id="formElement>
   <option>1</option>
   <option>2</option>
  </select>
</form>

PS. If the code doesn't display as code this time its not my fault!:)

Seachmall

9:00 pm on Oct 31, 2007 (gmt 0)

Theres a spelling mistake in the example I just gave you. It should be

document.formName.formElement;

XtendScott

11:00 pm on Oct 31, 2007 (gmt 0)

document.formName.formElement referencing the form and elements by the attribute ' name="?" '.

If you don't have the form Name, but you use id="formID" then you use document.getElementById("formID").

you can add a name="FormName" which almost always is the same as the id attribute.

If your not using the name attribute, you can use:
myFormElem = document.getElementById("formElement")

The rest should work as is.