blog

Home / DeveloperSection / Blogs / Get Checked Radiobutton Using JavaScript

Get Checked Radiobutton Using JavaScript

Chris Anderson 35727 07-Sep-2011

In this blog I will explain how to create radio button in html and how to get checked radio button value by using java script.

First create simple radio button in HTML:

     <table cellspacing="10">
        <tr>
            <td valign="top">
                Select technology:
            </td>
            <td>
                <input type="radio" value="PHP" name="radiodbtn" />PHP
                <input type="radio" value="ASP.NET" name="radiodbtn" />ASP.NET
                <input type="radio" value="JSP" name="radiodbtn" />JSP
                <input type="radio" value="ASP.NET MVC" name="radiodbtn" />ASP.NET MVC             </td>
        </tr>
        <tr>
            <td colspan="2" align="center">
                <input type="button" value="Enter"/>
            </td>
        </tr>
   </table>

 After creating radio buttons, create a function in java script that check whether a radio button is checked or not and if a radio button is checked, alert box display radio button value and also call that function on the click of button:

   function getSelectedRadioButton() {

            var ctr = 0;
            var radioLength = radiodbtn.length;
            for (var i = 0; i < radioLength; i++) {
                if (radiodbtn[i].checked) {
                    alert(radiodbtn[i].value);
                    break;
                }
                ctr++;
            }
            if (ctr == radioLength)
                alert("None of the technologies have been selected:");
        }     

 <input type="button" value="Enter" onclick="getSelectedRadioButton()" /> 

By reading this blog you can easily learn how to get selected radio button value through java script. Thank you for reading this blog.


Updated 18-Sep-2014
hi I am software developer at mindstick software pvt. ltd.

Leave Comment

Comments

Liked By