forms (select & radio buttons)

phyllis posted this at 18:27 — 14th June 2000.

Joined: Mar 2000

Hi,

In a form, is it possible to change what's (showing) in a drop-down menu by changing the focus of a radio button? Here is what I would like to do: I have a form with two radio buttons. One radio button gives you an option, the other gives you a drop-down menu where you pick an option. If a person picks an option from the second radio button, and then changes their mind and picks the first radio button instead, is there a way that I can make the drop-down menu (on the second radio button) revert back to its default that it had before they made a choice? I can't remember seeing this done, so maybe it's not possible(?). Here is the (no doubt messed-up) syntax that I was trying for this:
onBlur="forms[0].radiobutton[1].options[selectedIndex].value='defaulttext'"

Any ideas?

Phyllis

Suzanne posted this at 22:19 — 14th June 2000.

She has: 5,507 posts

Joined: Feb 2000

Hi, off the top of my head suggestions:

document.forms[0].radiobutton[1].options[selectedIndex].value='' (radio buttons can only be checked or null)

But realistically, radio buttons are on/off and so if someone changes his/her mind, he/she would simply have to choose the other radio button in order to turn "off" the one with the drop-down list. Simply have the same name for the two radio buttons. (Which is what you should have if the options are either/or anyway...)

I'm not really clear what you mean about the drop-down list, though. Perhaps a link would be useful?

Suzanne

------------------
Zero Cattle
Suzanne
Tables DeMystified

Vincent Puglia posted this at 00:29 — 15th June 2000.

They have: 634 posts

Joined: Dec 1999

Hi,

Let me get this straight. You have 2 radio buttons (same name, different values). If I press radio1, I get something. If I press radio2, I get a dropdown with more options. The buttons are defined something like:
<input type='radio' name='myOptions' value='default option'>Default Option
<input type='radio' name='myOptions' value='something'>Other options

Somehow or another clicking on the second button displays the selection list (dHTML? or the list is there, but blurred from the beginning?)

You want to be able to jump back and forth between the options, presumably until a submit is sent.

To change the text in a dropdown (select) menu:
document.formname.selectname.options[x].text = 'something';

To change it back to its original selectedIndex:

document.formname.selectname.options[x].selectedIndex = 0;

(I'm presuming the first selection is the default for the menu)

if you are changing it from a radio button, you could use the onClick event handler to call a function to accomplish the above line.

Hope this helps. If not, don't worry. It made me think.

Vinny

------------------
my site:GrassBlade: cut&paste javascript
moderator at:The Javascript Place
Javascript City

Where the world once stood
the blades of grass cut me still

phyllis posted this at 13:20 — 15th June 2000.

They have: 59 posts

Joined: Mar 2000

Hi! Thanks for your input!

My problem has now been solved. I'm going to post the answer here because the answer will tell you what the question was probably much better than my original post. Unfortunately I didn't figure this out myself but got the answer from another source. One day. I understand the stuff after I look at it, but I never seem to get there from here on my own. Sigh...

Here's the answer:

<HTML>
<HEAD>
<TITLE>test</TITLE>
</HEAD>
<BODY>
<FORM NAME="frm1">
<INPUT TYPE="radio" name="rad1" value="opt1" onFocus="this.form.sel1.options[0].selected = true;">Option 1
<INPUT TYPE="radio" name="rad1" value="opt2">
<select name="sel1" onChange="this.form.rad1[1].checked = true;">
<option value="">Select from list</option>
<option value="opt2">Option 2</option>
<option value="opt3">Option 3</option>
<option value="opt4">Option 4</option>
<option value="opt5">Option 5</option>
<option value="opt6">Option 6</option>
</select>
</FORM>

</BODY>
</HTML>

It cause the drop-down menu in the second radio option to revert back to its original text if you switch to the first radio button (it doesn't by default). My approach trying to use onBlur was a little backward I think.

Thanks,
Phyllis