homepage Welcome to WebmasterWorld Guest from 54.167.174.90
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
javascript form element test
testing for a selected radio button
jatar_k

WebmasterWorld Administrator jatar_k us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 149 posted 4:55 pm on Jun 28, 2002 (gmt 0)

I just want to check to see if one of a group of 4 radio buttons is selected. What do you use?

document.form.radioname[??].??

is it like selects with selectedIndex and value or what, I can't seem to make it work. I am out to lunch this morning.

 

mavherick

10+ Year Member



 
Msg#: 149 posted 5:09 pm on Jun 28, 2002 (gmt 0)

I'm not sure I understand your question, but I'll try anyway.

If I remember correctly, let's say we have a group of 4 radio button as follow:

<input type="radio" name="group1" value="1" />
<input type="radio" name="group1" value="2" />
<input type="radio" name="group1" value="3" />
<input type="radio" name="group1" value="4" />

Now if you want to access the value of group1:
document.form.group1.value

So you can simply test with that value if the field you want is selected.

You might want to make sure one of those is selected by default to avoid uninitialized variables in case no selection is made by the user.

jatar_k

WebmasterWorld Administrator jatar_k us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 149 posted 5:16 pm on Jun 28, 2002 (gmt 0)

thx mavherick,

I realize now that I wasn't quite clear enough.

If the group is uninitialized, no default selection, and the user doesn't select one what can you use to test it? I just want an alert that says "please select" if there is nothing selected.

moonbiter

10+ Year Member



 
Msg#: 149 posted 5:17 pm on Jun 28, 2002 (gmt 0)

You look through the input elements and look for:

document.form.radioname[i].checked

If true, then that is the one selected.

jatar_k

WebmasterWorld Administrator jatar_k us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 149 posted 5:20 pm on Jun 28, 2002 (gmt 0)

perfect, that was what I couldn't think of, now if I just get my brain in gear I can stop asking stupid questions and finish this.

that's twice moonbiter, thx

moonbiter

10+ Year Member



 
Msg#: 149 posted 5:24 pm on Jun 28, 2002 (gmt 0)

Here's a sample I think works ...

<html>
<head>
<title>Untitled</title>
<script type="text/javascript">
function check(){
for (i=0;i<document.form.group1.length;i++){
if(document.form.group1[i].checked){
alert(document.form.group1[i].value);
}
}
}

</script>

</head>

<body>
<form name="form" action="">
<input type="radio" name="group1" value="1" />
<input type="radio" name="group1" value="2" />
<input type="radio" name="group1" value="3" />
<input type="radio" name="group1" value="4" />
<button onclick="check();">Click!</button>
</form>

</body>
</html>

jatar_k

WebmasterWorld Administrator jatar_k us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 149 posted 5:30 pm on Jun 28, 2002 (gmt 0)

I already got it working, I just was fixated on having 4 if statements and couldn't get past it. I just did this,

var wherecheck = 1;
for (i=0;i<4;i++) {
if (document.form1.whereFrom[i].checked) wherecheck=0;
}

I needed to use the variable later.

mavherick

10+ Year Member



 
Msg#: 149 posted 5:30 pm on Jun 28, 2002 (gmt 0)

I'd like to simply add that if no radio button is selected would the following work??

if (document.form.group1.value == undefined) {
alert('Please select an option!');
}

It seems to me it could but who knows...

mavherick

moonbiter

10+ Year Member



 
Msg#: 149 posted 5:31 pm on Jun 28, 2002 (gmt 0)

Way cool. Every example I can see of how other people do it helps. Thanks.

jatar_k

WebmasterWorld Administrator jatar_k us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 149 posted 5:37 pm on Jun 28, 2002 (gmt 0)

mavherick,

that was what I was originally trying, just fell through every time.

mavherick

10+ Year Member



 
Msg#: 149 posted 6:00 pm on Jun 28, 2002 (gmt 0)

You're absolutely right. Maybe because the value of document.form.group1.value gets set only when the form is submitted? I can't really think of anything else.

jatar_k

WebmasterWorld Administrator jatar_k us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 149 posted 6:05 pm on Jun 28, 2002 (gmt 0)

I think it is because group1.value is not valid. Without an index, group1[0].value, the attribute "value" doesn't apply. There is no value to the group1 obj.

mavherick

10+ Year Member



 
Msg#: 149 posted 6:44 pm on Jun 28, 2002 (gmt 0)

Thanks jatar_k, this is very enlightening. You see, I've always thought of radio button like a drop down box. I guess I wrongly assumed that since I can refer to the value of group1 in coldfusion, I could do the same in JavaScript. There is probably some manipulation going on by coldfusion to assign values to such form fields.

rewboss

10+ Year Member



 
Msg#: 149 posted 10:02 pm on Jun 29, 2002 (gmt 0)

for(button in document.form.group1) if(document.form.group1[button].checked) whereChecked=document.form.group1[button].value;

That'll do it in one statement :), although I think that if you give each button a value, it might go through the array twice, once as a numerical array and once as an associative array -- but I could be wrong. This approach has the advantage that you don't need to hard-code how many elements there are (ease of maintenance, i.e. if at a later date you want to add or remove options).

Another approach cuts down the number of times to loop iterates, but the saving is probably minimal:

for(button in document.form.group1) if(document.form.group1[button].checked){
whereChecked=document.form.group1[button].value;
break;
}

An alternative:

for(i=0; i<document.form.group1.length; i++) if(document.form.group1[i].checked){
whereChecked=document.form.group1[i].value;
break;
}

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved