Reputation: 101
I have my html code like this. From this piece of code i would like to get Radio button value when user selects(checked) that value. How to get that value. I got solutions when user clicks on a button or the function has to be called. But i require solution using jQuery when user checks it.
HTML code:
<div id="Report_Name" class="leaf">
<fieldset class="control select multiple" title="">
<legend>* Select Report Name</legend>
<ul class="list inputSet sizable"> <li>
<div class="control radio">
<input checked="checked" class="" id="Report_Name1" type="radio" name="Report_Name_option" value="4">
<label class="wrap" for="Report_Name1" title="">
ALL
</label>
</div>
</li>
<li>
<div class="control radio">
<input class="" id="Report_Name2" type="radio" name="Report_Name_option" value="1">
<label class="wrap" for="Report_Name2" title="">
Cash
</label>
</div>
</li>
<li>
<div class="control radio">
<input class="" id="Report_Name3" type="radio" name="Report_Name_option" value="2">
<label class="wrap" for="Report_Name3" title="">
FDR
</label>
</div>
</li>
<li>
<div class="control radio">
<input class="" id="Report_Name4" type="radio" name="Report_Name_option" value="3">
<label class="wrap" for="Report_Name4" title="">
Summary
</label>
</div>
</li>
</ul>
</fieldset>
<span class="warning"></span>
<div class="resizeOverlay hidden"></div>
<div class="sizer vertical" style="position: relative;"><span class="ui-icon ui-icon-grip-solid-horizontal"></span></div>
</div>
Upvotes: 0
Views: 1240
Reputation: 1439
You need to attach .change event with Radio Button , so after that you can get the value of checked radio button using :checked
In below code we are filtering radio button by name and attaching change event to it and then finding the checked value of radio
$("input:radio[name=Report_Name_option]").change(function(){
console.log($('input:radio[name=Report_Name_option]:checked').val());
});
Upvotes: 1
Reputation: 74738
You can try this:
$('#Report_Name').find('[type="radio"]').on('change', function(){
console.log(this.value);
});
You have to find the radios
in this #Report_Name
div and apply a .change()
event to it and get the value of that radio. As you have one radio selected by default so you can get it with triggering the change event on load.
Upvotes: 0
Reputation: 75113
example: Demo in JsBin
$(function() {
$(".inputSet input[type=radio]").change(function() {
// for every change on the radio selection
checkRadioSelection();
});
// so you get the default selection
checkRadioSelection();
});
function checkRadioSelection()
{
var r = $(".inputSet input[type=radio]:checked");
$(".warning").text("You have selected: " + r.val() );
}
Upvotes: 0
Reputation: 1387
After a quick search I found a pretty much complete answer for you. Anyway you want to try something like this:
$("input:radio[name=Report_Name_option]").click(function() {
var x = $(this).val();
});
I hope this helps!
Upvotes: 0
Reputation: 133453
You need to bind the .change() event with radio button. Then you can use :checked Selector to find the selected radio option.
Example
$(document).ready(function () {
$(':radio[name="Report_Name_option"]').change(function () {
alert($(':radio[name="Report_Name_option"]:checked').val())
})
});
Upvotes: 1