use jquery client side validation in asp.net web forms | Coding Solutions With Ankit
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="index.aspx.cs" Inherits="JqueryValidation.index" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="https://code.jquery.com/jquery-3.7.1.js" integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4=" crossorigin="anonymous"></script>
<script>
$(document).ready(function () {
//$("[id*=ControlID]");//Selector
$("[id*=btnsubmit]").click(function () {
if ($("[id*=txtname]").val() == "") {
alert("Please enter name");
$("[id*=txtname]").focus();
$("[id*=txtname]").css("border", "1px solid red");
return false;
}
else
{
$("[id*=txtname]").css("border","1px solid green");
}
if ($("[id*=txtMobile]").val() == "") {
alert("Please enter mobile no");
$("[id*=txtmobile]").focus();
return false;
}
if ($("[id*=txtMobile]").val().length != 10) {
alert("Please enter valid mobile no");
$("[id*=txtmobile]").focus();
return false;
}
if ($("[id*=ddlstate] option:selected").val()==0)
{
alert("Please select state");
$("[id*=ddlstate]").focus();
return false;
}
if ($("[id*=ddlstate] option:selected").val()=="--Select--")
{
alert("Please select state");
$("[id*=ddstate]").focus();
return false;
}
if ($("[id*=txtemail]").val()=="")
{
alert("Please select email");
$("[id*=txtemail]").focus();
return false;
}
alert("Okey");
return true;
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<label>Name :</label>
<asp:TextBox ID="txtname" runat="server"></asp:TextBox>
<br/>
<label>Mobile :</label>
<asp:TextBox ID="txtMobile" runat="server"></asp:TextBox>
<br/>
<label>State :</label>
<asp:DropDownList ID="ddlstate" runat="server">
<asp:ListItem Text="--Select--" Value="0"></asp:ListItem>
<asp:ListItem Text="Uttar Pradesh" Value="1"></asp:ListItem>
<asp:ListItem Text="Haryana" Value="2"></asp:ListItem>
</asp:DropDownList>
<br/>
<label>Email :</label>
<asp:TextBox ID="txtemail" runat="server"></asp:TextBox>
<br/>
<asp:Button ID="btnsubmit" UseSubmitBehavior="false" runat="server" Text="Submit" OnClientClick="return false;"/>
</div>
</form>
</body>
</html>
.png)
.png)
.png)
.png)
.png)
.png)
.png)
Comments
Post a Comment