ASP.net, How can I see the selected value of a radio button in javascript

sw29 0
Viewed 36

I thought myRadioButton.value would work but value doesn't come up as an option I can select. If I select nodevalue the value of that during runtime is null. "No" should be selected by default but I'm not sure how to bring up that value in my javascript code. What am I missing?

<script type="text/javascript">
    function TextValidation(oSrouce, args) {
     
        var myRadioButton = document.getElementById('<%= rblUserEquip.ClientID %>'); 
        var myTextBox = document.getElementById('<%= txtEmpName.ClientID %>');
        alert("Test" + myRadioButton.value);
        if (myRadioButton.value == "no")
            {
            alert("Test2");
                if (myTextBox.value == "")
                {
                    args.IsValid = False;
                    alert("Employee name empty");
                    return false;
                }
                else
                    args.IsValid = True;
            }
            else
            {
                args.IsValid = True;
                alert("Test3");
            }
        }
</script> 

<asp:RadioButtonList ID="rblUserEquip" runat="server">
     <asp:ListItem Value="yes" Text="Yes"></asp:ListItem>
     <asp:ListItem Value="no" Text="No" Selected="True"></asp:ListItem>
</asp:RadioButtonList>
<asp:TextBox ID="txtEmpName" runat="server" ></asp:TextBox>
<asp:CustomValidator runat="server" ID="cvEmpName" ClientValidationFunction="TextValidation" Display="Dynamic" text="*" ErrorMessage="Please fill TextBox" ></asp:CustomValidator>
<cc1:ValidatorCalloutExtender ID="vceSymptoms" runat="server" TargetControlID="cvEmpName"></cc1:ValidatorCalloutExtender>
asp.net javascript
1 Answers

It works like this:

        <asp:RadioButtonList ID="rblUserEquip" runat="server" ClientIDMode="Static">
            <asp:ListItem Value="1" Text="Yes"></asp:ListItem>
            <asp:ListItem Value="2" Text="No" Selected="True"></asp:ListItem>
        </asp:RadioButtonList>

        <br />
        <asp:Button ID="Button2" runat="server" Text="Client side = get RB value" 
            OnClientClick="MyRB();return false;"/>
        <br />
        <script>

            function MyRB() {
                // get radio button choice
                rbl = $('#rblUserEquip')
                choices = rbl.find('input')
                choicesText = rbl.find('label')

                console.log(choices[0].checked)
                console.log("choice value = "  + choices[0].value)
                console.log("choice Text =  " + choicesText[0].innerText)

                // get selected rb only
                mysel = rbl.find('input:checked')
                console.log("choice value for sel = " + mysel[0].value)
            }

        </script>

Note how you can't get the "text" value, since it is rendered as a separate label. I assumed jQuery for above - but above should suffice for what you require.

And for avoiding confusing, I changed the above "yes" (value) to 1, and 2. Since we REALLY want to be crystal clear that we can get the "value" of the input, but the actual text is generated and displayed as a 100% separate label.

so, running above js code, then we get/see this:

output:

 false
 choice value = 1
 choice Text = Yes

(above is first value in array of choices)

last set of code, we select based on checked

Ouput:

 choice value for sel = 2
Albert D. Kallal0
Related