Get Selected Text and Value of ASP.Net RadioButtonList using jQuery
The below code snippet explains how to get the Selected Text and Selected Value part of ASP.Net RadioButtonList control using jQuery.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript" language="javascript">
        $("#demo").live("click", function () {
            var checkedRadio = $("#rbFruits input[type=radio]:checked");
            if (checkedRadio.length > 0) {
                var selectedValue = checkedRadio.val();
                var selectedText = checkedRadio.next().html();
                alert("Selected Text: " + selectedText + " Selected Value: " + selectedValue);
            } else {
                alert("Item not selected.");
            }
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:RadioButtonList ID="rbFruits" runat="server">
        <asp:ListItem Text="Mango" Value="1" />
        <asp:ListItem Text="Apple" Value="2" />
        <asp:ListItem Text="Banana" Value="3" />
    </asp:RadioButtonList>
    <input type = "button" id = "demo" value = "Demo" />
    </form>
</body>
</html>
 
 
Explanation:
In the above code snippet I have an ASP.Net RadioButtonList control rbFruits and an HTML button demo to which I have assigned jQuery click event handler. When the HTML button is clicked, first we determine the checked Radio Button from the list of Radio Buttons in the ASP.Net RadioButtonList control using the selector #rbFruits input[type=radio]:checked. Once that is determined we find the SelectedText (which is available in the HTML label control next to the RadioButton in the ASP.Net RadioButtonList) and SelectedValue (which is the value of the checked Radio Button).
 
Demo: