How to find the Status of a Radio Button Using jQuery?

When I was working on one of my projects I suddenly landed up in a situation where I wanted to find out as to which radio button has been selected or checked. So having discovered that, I am going to present you with different ways in which you can find out whether a radio button has been checked or not:

1)  Here in the below line of jQuery code you can see that it will give you the status of your radio button. This code fragment will find out whether the “Checked” property of the radio button has been tick marked or not and based on the output with return either true or false. One point here to be noted is that the below line of code will function properly with jQuery Version 1.7.2 and higher:

1
var isChecked = $('#rdSelect').prop('checked');

Nevertheless if you are not having the latest version of jQuery installed then you must use the below code fragment to select the value of a radio button :

1
 var isChecked = $('#rdSelect').attr('checked')?true: false;

 

I happened to read on different sources that the “Checked” attribute of a radio button will return either true or false if it is used with the “attr” method  however this is not so true because if you checked the checked box then the result will give you the status as checked otherwise it will give the status to be undefined. So if you want the result to be either true or false in that case make use of the conditional expression that is mentioned in the above code fragment.

 

2)  One more method to get the value of the selected radio button is to use the

1
$('#rdSelect: checked').Val()

method which will return undefined if the radio button is not checked and return “On” if it is checked.
Here is the code fragment  to be used :

1
var isChecked = $('#rdSelect: checked').Val()?true: false;

3) Another simple way is to make use of the is() selector so that it will return either true or false based on the status of the radio button.

Here is the code fragment  to be used :

1
var isChecked = $('#rdSelect').is(‘checked’);

 

 

WordPress Speed Test

Recently Published

»

How More Powerful Smartphones Are Making Websites Load Faster

Smartphone speeds keep accelerating. Last October, Qualcomm joined ...

»

The Most Effective Method To Present A Logo Plan

The Most well-known creators’ battles are and how they are ...

»

Sure Guide for Improving Your WP Site Accessibility

This article compiles some best practices to optimize a WordPress ...

»

9 Social Media and Marketing Tools Recommended for a Business

A business is set up to have a profit by delivering a product or a ...

»

Why hand-coding is always preferable over website builders

There is long debate as to why hand-coding is preferable over website ...

»

8 Reasons Your Site Should be Using Progressive Web Apps

Google has been driving at full speed since 2015 to help developers, ...

»

Tips to Handle Negative Feedback for Your Mobile App

Feedback from users for your mobile app is as essential as its ...

»

Why is Link Building So Important? Read this to understand

Getting a high ranking on search engine results is important to the ...

»

Productivity Tips for Web Developers for Efficient Time Management

The world is full of distractions. Whether you are a work-from-home, ...