Comments on: How to make radio box be selected when user enters accompanying text.

Question: How to make radio box be selected when user enters accompanying text.

Blue Buddha — Tue, 12 Sep 2006 11:44:53 -0800

In a web survey form, I need to automatically check a radio box if the user clicks on the text field.

I have a questionnaire with "Other (please specify)" as a radio option, with a text field next to it. I would like to have the radio button automatically selected if the user decides to just type a name in the text field and ignoring the radio box. I saw a javascript that checks the radio button, however you can't type into the accompanying text field...

I'm not that great at javascript. Help!

By: Blue Buddha

Blue Buddha — Tue, 12 Sep 2006 11:46:25 -0800

Er, I guess you can't have forms in posts (where that empty space is). You can check the javascript, slightly modified, here.

By: apark

apark — Tue, 12 Sep 2006 11:53:51 -0800

What you'll want to do is handle the onClick, onChange, or the onFocus event (depending on the desired behavior) of the text field and use the handler to modify the value of the radio button. Actually, you probably want to use the onChange event because if the user is navigating using a keyboard, you don't want the other events to fire and invalidate his/her answer when it navigates through the "Other" field.

This site is helpful.

By: Blue Buddha

Blue Buddha — Tue, 12 Sep 2006 12:06:16 -0800

Thanks apark! I changed the onFocys to onChange and that did the trick when going to the next question.

By: darkpony

darkpony — Tue, 12 Sep 2006 12:07:24 -0800

< script text/javascript>
function setRadio()
{
document.getElementById("Cheese").checked=true
}
< /script>

< input radio name="group1" id="Butter" value="Butter" checked> Butter

< input radio name="group1" id="Cheese" value="Cheese"> Cheese

< input 'text' name="other" setradio(); />

By: Doofus Magoo

Doofus Magoo — Tue, 12 Sep 2006 12:08:06 -0800

The first example in the link you gave would work; just take out the "blur," which removes the focus from the form element (which obviously would prevent you from ever typing anything there):

<INPUT TYPE="TEXT" onFocus="document.formName.radiobutton.checked=true">

By: darkpony

darkpony — Tue, 12 Sep 2006 12:08:17 -0800

shoot something got lost in the input:
onfocus = ' setradio();'

By: apark

apark — Tue, 12 Sep 2006 13:00:58 -0800

You're welcome!

By: AmbroseChapel

AmbroseChapel — Tue, 12 Sep 2006 14:52:45 -0800

Two points:

if it's a button all by itself, which simply registers yes or no, then it should be a checkbox not a radio button -- radios are for mutually-exclusive options
what's the point of this? If the test is simply "is there anything in the text box or not" you don't need a separate checkbox, do you? You just need a check for content in the text box.

By: mbrubeck

mbrubeck — Tue, 12 Sep 2006 17:29:10 -0800

Ambrose, see the original poster's question for an explanation of the use case (a set of radio buttons, one of which has an associated text field).