Client Side Validation Using Javascript In Asp.Net
Here we are using validation in javascript.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Javascript Validation</title>
<script src="Script/jquery-1.9.0.min.js" type="text/javascript"></script>
<script type="text/javascript">
function validation() {
// Required field validation for Name
if (document.getElementById("txtName").value == ""
)
{
alert("Please enter Name");
return false;
}
// Required field validation for Mobile
if (document.getElementById("txtMobile").value == ""
)
{
alert("Please enter Mobile");
return false;
}
// Regular expression validation for Mobile
if (document.getElementById("txtMobile").value != ""
)
{
if (isNaN(document.getElementById("txtMobile").value)) {
alert("Please enter mobile number only numeric values");
return false;
}
}
// Required field validation for Email
if (document.getElementById("txtEmail").value == ""
)
{
alert("Please enter EmailID");
return false;
}
// Regular expression validation for Email
if ((document.getElementById("txtEmail").value) != ""
)
{
var pattern = /^([a-zA-Z0-9_\.\-])+\@(([a - zA - Z0 - 9\-]) +\.)+([a-zA-Z0-9]{2,4})+$/;
if (!pattern.test(document.getElementById("txtEmail"
).value))
{
alert("Please enter valid EmailID");
return false;
}
}
// Required field validation for Address
if (document.getElementById("txtAddress").value == ""
)
{
alert("Please enter Address");
return false;
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table align="left" >
<tr>
<td>Name</td>
<td>
<asp:TextBox ID="txtName" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td>Mobile</td>
<td>
<asp:TextBox ID="txtMobile" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td>Email</td>
<td>
<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td>Address</td>
<td>
<asp:TextBox ID="txtAddress" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td colspan="2">
<asp:Button ID="btnSave" runat="server" Text="Save" OnClientClick="return
validation();" OnClick="btnSave_Click" /></td>
</tr>
</table>
</div>
</form>
</body>
</html>
View output :
