jQuery Latest CDN Links

How to Validate RadioButtonList using JavaScript in ASP.Net

 

How to Validate RadioButtonList using JavaScript in ASP.Net
How to Validate RadioButtonList using JavaScript in ASP.Net


In this article I will show you how to validate Raiobuttonlist using javascript in Asp.Net. 

Step1:

Here I will add a RadioButtonList and Button to validate the RadioButtonList. 

HTML:

 <asp:RadioButtonList ID="RadioButtonList1" runat="server">
      <asp:ListItem Text="One" Value="1"></asp:ListItem>
      <asp:ListItem Text="Two" Value="2"></asp:ListItem>
      <asp:ListItem Text="Three" Value="3"></asp:ListItem>
 </asp:RadioButtonList>
 <asp:Button ID="btnSubmit" runat="server" Text="Validate" OnClientClick="return Validate()" />

Now I will add some javascript code to validate the RadioButtonList. The javascript function will call when user press the submit button. In this code I will call the javascript function using OnClientClick.

Step2:

Javascript:

<script type="text/javascript">
            function Validate() {
                var rb = document.getElementById("RadioButtonList1");  //radiobuttonlist id
                var radio = rb.getElementsByTagName("input"); 
                var isChecked = false;
                for (var i = 0; i < radio.length; i++) {
                    if (radio[i].checked) {
                        isChecked = true;
                        break;
                    }
                }
                if (!isChecked) {
                    alert("Please select an option!");
                }
                return isChecked;
            }
</script>

Full Code:


<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Demo3.aspx.cs" Inherits="Demo.Demo3" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:RadioButtonList ID="RadioButtonList1" runat="server">
                <asp:ListItem Text="One" Value="1"></asp:ListItem>
                <asp:ListItem Text="Two" Value="2"></asp:ListItem>
                <asp:ListItem Text="Three" Value="3"></asp:ListItem>
            </asp:RadioButtonList>
            <asp:Button ID="btnSubmit" runat="server" Text="Validate" OnClientClick="return Validate()" />
        </div>
        <script type="text/javascript">
            function Validate() {
                var rb = document.getElementById("RadioButtonList1");  //radiobuttonlist id
                var radio = rb.getElementsByTagName("input");
                var isChecked = false;
                for (var i = 0; i < radio.length; i++) {
                    if (radio[i].checked) {
                        isChecked = true;
                        break;
                    }
                }
                if (!isChecked) {
                    alert("Please select an option!");
                }
                return isChecked;
            }
        </script>
    </form>
</body>
</html>

Demo Screenshots:

How to Validate RadioButtonList using JavaScript in ASP.Net

Please mail me at hemanta@webcodespider.net if you want any code solution from me. 

Thank You 😊 

How to Bind/Fill/Populate DropDownList in Asp.Net using Jquery Ajax and Json in C# and VB.Net

India



Comments