How to Get Value of Radio button group using jQuery?

After jQuery comes into the programming world we just started love to programming because of its simplicity and quality.

Lets see how can we retrive the value of a radio button group.

See the piece of code will get the selected value from a radio group:


$("input:radio[name='groupname']:checked").val();

Here is the example program for you to understand the workflow:


<html>
<head>
<title>How to get the value of selected radio button group</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#check').click(function() {
var oneval = $("input:radio[name='one']:checked").val();
var twoval = $("input:radio[name='two']:checked").val();

alert('First value is '+oneval+', Second value is '+twoval);

});
})

</script>
</head>

<body>
<form name="form" method="post" action="">
Question 1<br/>
<input type="radio" name="one" value="1"/> Ans1
<input type="radio" name="one" value="2"/> Ans2
<input type="radio" name="one" value="3"/> Ans3
<br/><br/>
Question 2<br/>
<input type="radio" name="two" value="1"/> Ans1
<input type="radio" name="two" value="2"/> Ans2
<input type="radio" name="two" value="3"/> Ans3

<input type="button" value="Test" id="check" />
</form>
</html>

Leave a Reply

Theme: Overlay by Kaira
Agurchand