Dear All, Here i would like to present ASP.NET Form Validation Using JQuery
1.Design the form as below
Image:
Code Behind :
1.Design the form as below
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JQ20.aspx.cs" Inherits="WebApplication1.JQ20" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.8.2.min.js"></script>
<script>
$(function () {
var isValid = true;
$("#btnSubmit").click(function () {
$("input[type='text'],textarea,select").each(function () {
if ($(this).val() == '' || $(this).val() == '0') {
$(this).css('border', '1px solid red'); $(this).next().append($(this).parent().prev("td").text().substring(5,$(this).parent().prev("td").text().length)
+ ' is mandatory').css('color','Red');
isValid = false;
}
});
if (isValid == false)
event.preventDefault();
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<table>
<tr>
<td>Enter Name</td>
<td>
<asp:TextBox ID="txtName" runat="server"></asp:TextBox>
<span></span>
</td>
</tr>
<tr>
<td>Enter Email ID</td>
<td>
<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
<span></span>
</td>
</tr>
<tr>
<td>Enter Mobile No</td>
<td>
<asp:TextBox ID="txtMNo" runat="server"></asp:TextBox>
<span></span>
</td>
</tr>
<tr>
<td>Enter Qualification</td>
<td>
<asp:DropDownList ID="ddlQuali" runat="server">
<asp:ListItem Text="Select" Value="0"></asp:ListItem>
<asp:ListItem Text="B.Tech" Value="1"></asp:ListItem>
<asp:ListItem Text="M.Tech" Value="2"></asp:ListItem>
<asp:ListItem Text="MCA" Value="3"></asp:ListItem>
</asp:DropDownList>
<span></span>
</td>
</tr>
<tr>
<td>Enter Address of Communication</td>
<td>
<asp:TextBox ID="txtAOC" runat="server" TextMode="MultiLine"></asp:TextBox>
<span></span>
</td>
</tr>
<tr>
<td>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click" />
</td>
<td>
<input type="reset" value="Clear" />
</td>
</tr>
</table>
</form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebApplication1
{
public partial class JQ20 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
Response.Write("<script>alert('Form Submitted
Sucessfully')</script>");
}
}
}
Hi please share your number or email id...
ReplyDelete