Click here to Skip to main content
12,545,840 members (61,250 online)
Click here to Skip to main content
Add your own
alternative version

Tagged as


5 bookmarked

Radio Buttons, Groups and JQuery

, 18 Jul 2011 CPOL
Rate this:
Please Sign up or sign in to vote.
Simple implementation for determining which radio buttons are selected using Jquery
Recently I was working on a small tool/article and was trying to work out the simplest way of handling RadioButtons, Radio Button Groups and then determining which is selected using JQuery.

This is the implementation I came up with;

1) Add your radio buttons to the page and assign them their unique ID as usual
2) For each radio button in the group, set the NAME property to the SAME value
3) Assign a unique value to each radio button VALUE property

What you will end up with is something like the following (radio button 1 is default selected);

<input type="radio" id="radio1" name="RadioGroup1" value="1" checked="true"/>
<input type="radio" id="radio2" name="RadioGroup1" value="2" />
<input type="radio" id="radio3" name="RadioGroup1" value="3" />

By assigning the same NAME to each radio button means that if radio2 is selected, then radio1 and radio3 are deselected. If you don't set the same name, then multiple radio buttons can become selected.

Then to determine which radio button is selected using JQuery you can use the following code;
var value = $("input[name=RadioGroup1]:checked").val();
alert("The user selected; " + value);

The JQuery statement, looks for an input element which has the name property "RadioGroup1" and is checked, then returns its value.


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Scotland Scotland
I have been working in the Oil & Gas Industry for over 25 years now.

Core Discipline is Instrumentation and Control Systems.

Completed Bsc Honours Degree (B29 in Computing) with the Open University in 2012.

Currently, Offshore Installation Manager in the Al Shaheen oil field, which is located off the coast of Qatar.

Prior to this, 25 years of North Sea Oil & Gas experience.

You may also be interested in...

Comments and Discussions

GeneralReason for my vote of 4 Very simple and straight forward. A... Pin
BrianBissell26-Jul-11 3:59
memberBrianBissell26-Jul-11 3:59 
GeneralRe: Hi Brian, thanks for the feedback, but what is missing about... Pin
DaveAuld26-Jul-11 4:42
mentorDaveAuld26-Jul-11 4:42 
GeneralThanks, I have corrected my error in the code, thanks for po... Pin
DaveAuld18-Jul-11 23:10
mentorDaveAuld18-Jul-11 23:10 
GeneralYou don't need (or must not) use '@' before the attribute na... Pin
dblaci18-Jul-11 23:07
memberdblaci18-Jul-11 23:07 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.161018.1 | Last Updated 19 Jul 2011
Article Copyright 2011 by DaveAuld
Everything else Copyright © CodeProject, 1999-2016
Layout: fixed | fluid