Radio button is used when developer wants users to select only one option in a list. For example, to check if a user is a male or female.
Table of Contents
Best Radio Plugins
- Bootstrap Switch – Turn checkboxes and radio buttons into toggle switches. It depends on Bootstrap framework, and it compatible with Bootstrap 4, Bootstrap 3 and Bootstrap 2.
- Magic Check – Beautify Radio and Checkbox with pure CSS.
- Labelauty – A nice and lightweight jQuery plugin that gives beauty to checkboxes and radio buttons and allows custom labels for each status of (un)checked inputs.
- ezMark – It style radio buttons using background images.
Get the value of selected radio button in jQuery
:checked selector returns radio field which is checked.
<input type="radio" name="sex" value="male">
<input type="radio" name="sex" value="female">
<input type="button" id="submit" value="Submit">$(document).ready(function(){
$("#submit").on('click', function(){
var selected = $("input[name='sex']:checked").val();
if(selected){
console.log("Your choice is " + selected);
}
});
});Get value on change
$('input[type="radio"]).on('change', function() {
console.log($(this).val())
});