You can use jquery selectors :checked or $(this) to get selected radio button value. The name attribute used here to group the radio buttons. See the example given in this tutorial to find the solution.

How to Get Selected Radio Button Value

If you want to get the value of the radio button you have selected, you can use below given two methods. Because these methods use the click event of the mouse, you also need to use the selectors.

Let’s see how to use them with the given examples.

1. Use $(this).val() method to Get Selected Radio Button Value

If you want to get the value of the currently selected radio button, you can use the $(this) selector with the val(). This gives the value of the currently selected radio button.

In addition to all this, you also need to give the selector input[type="radio"] for the click event as given below in the example.

Output

Pass
Fail
Promoted

In the above example, there are three radio buttons contains the result of the person. Click each button for the currently selected value of the radio button.

2. Use checked selector with val() to Get Selected Radio Button Value

You can also get the value of the selected radio button using the selector :checked with the function val(). Here, you also need to specify the jquery selector for the click event to access the required elements.

Output

Male
Female
Others

In the above example, select the gender of the person. An alert will appear that gives the value of the selected radio button.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.