Jquery to get the selected radio button value

Question

i have 3 set of radio buttons while selecting any one of them i have to get the value of that radio.

iam using following code

Daily<input type="radio" id="rad" value="daily" />
Weekly<input type="radio" id="rad" name="case" value="weekly"/>
None<input type="radio" id="rad" name="case" value="none"/>
alert("rad------"+$('#rad').val());

it alerts the radio button value first time only and multiple radio button seems to be as selected.

Answer 1

id of an element must be unique, so in this case you need to find the checked radio button with name case

For that you can use the attribute equals selector along with :checked selector

Daily <input type="radio" id="rad" name="case" value="daily" />
Weekly <input type="radio" id="rad" name="case" value="weekly" />
None <input type="radio" id="rad" name="case" value="none" />

alert("rad------"+$('input[type="radio"][name="case"]:checked').val());

Answer 2

Your problem may be in how you are detecting the change in event, you can do something like this:

$('container input:radio').click(function(){
    alert("rad------"+$(this).val());
});

notes

:radio is short for [type=radio]

substitute container for the container, or use input#radio in the case of your example. Generally it isn't a good idea to assign the same id to a bunch of inputs

Answer 3

Just to be a pedant - as Arun P Johny wrote IDs must be unique, but in his example he left the duplicate IDs in.

It should be:

Daily <input type="radio" name="case" value="daily" />
Weekly <input type="radio" name="case" value="weekly" />
None <input type="radio" name="case" value="none" />
alert("rad------"+$('input[type="radio"][name="case"]:checked').val());

See Two radio buttons share one "id"? for more details.