Changing screen display of <select> drop down menu

[peterinwa]

By calling a function that contains:

document.form1.sex.value="F";

I can change the content of:

<form name=form1>
<input type=text name=sex value="M" size=1 maxlength=1 border=1>

I can see the change take place on my page without needing to re-create the page.

Similarly, by calling a function that contains:

document.form1.results.value="new text";

I can change the content of:

<form name=form1>
<textarea name=results border=1 cols=50 rows=20>"original text"</textarea>

Again, I can see the change take place on my page without needing to re-create the page.

But I am having trouble changing the display of a drop down menu. I have a few on the page, and when something is selected from one of the drop down menus I want the others to automatically changed to indicate that they are available but not selected for use at the moment.

The drop down menu is:

<form name=form1><select name=list1 onChange='selectList(1)'>
<option value=0>General Food List
<option...

To try to change what it reads I have tried:

document.form1.list1[document.form1.list1.selectedIndex].value="new text";

Which does nothing, and the following which makes the text on the drop down menu go blank:

document.form1.list1.value="new text";

Can this be done? I somehow want it to be clear which drop down menu is currently being used, which would always be the last one from which a selection was made.

[Graeme Hackston]

this might help

http://www.devguru.com/Technologies/ecmascript/quickref/select_options.html

[cheesebagpipe]

Your first two examples just write a string to a form control...nothing very exotic. It's unclear (to me, anyway) exactly what you want to happen regarding the drop-downs. Describe it from a user perspective - what you want them to experience - hopefully this will suggest an answer.

[peterinwa]

I've kinda worked around it, but cheesebagpipe (cheesebagpipe!?!) has a good point about explaining better what I want.

I have two drop down menus (so far), and when the page first comes up one reads General Foods List and the other reads McDonald's Food List.

The user goes to the General Foods List drop down menue and selects Chicken Wing. Now this drop down menu reads Chicken Wing, and the page displays the nutrition info for a Chicken Wing.

Then the user goes to the McDonald's Food List drop down menu and selects Big Mac. Now this drop down menu reads Big Mac, and the page displays the nutrition info for a Big Mac.

At this point, while the McDonald's Food List drop down menu and the page display info on a Big Mac, the General Foods List drop down menu is still displaying Chicken Wing which is no longer relevant.

At the point a food is selected from one drop down menu, I would like the other drop down menu to display its title, i.e., its first option, i.e., either General Food List or McDonald's Food List.

[glenngv]

in other words, you need a double-combo script (http://www.javascriptkit.com/script/cut183.shtml)