Validation Using Jquery in Asp.net page
Hows Jquery validation works in Asp.net :
Complete Html Code for Jquery validation in asp.net page :
Introduction : This article show you how to add validation using Jquery in Asp.net . Validation is easy in jquery just need add my following complete html code for Jquery validation in asp.net .
Hows Jquery validation works in Asp.net :
you can download Jquery.validate.js from http://jzaefferer.github.com/jquery-validation/jquery.validate.js
you can apply required validation by adding class to textbox like : CssClass="required". ..etc .so on you can Url validation ,date validation , digits validation ..etc using jquery .
Complete Html Code for Jquery validation in asp.net page :
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JqueryValidation.aspx.cs" Inherits="HamidSite.JqueryValidation" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script> <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script> <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> <script src="Scripts/jquery.validate.js" type="text/javascript"></script> <script type="text/javascript" > $(document).ready(function () { $("#form1").validate(); }); </script> <style type="text/css"> label.error { float: none; color: red; padding-left: .5em; vertical-align: top; } </style> </head> <body> <form id="form1" runat="server"> <div> <fieldset style="width:500px;vertical-align:middle;font-family:Verdana;font-size:12px;border-bottom-width:medium;" > <legend>Validation Using Jquery in Asp.net page </legend> <table align="center" cellpadding="5px" > <tr> <td> Name : </td> <td> <asp:TextBox ID="txtname" CssClass="required" runat="server" ></asp:TextBox> </td> </tr> <tr> <td> Amount : </td> <td> <asp:TextBox ID="TextBox1" CssClass="digits" runat="server" ></asp:TextBox> </td> </tr> <tr> <td> Website url : </td> <td> <asp:TextBox ID="TextBox2" CssClass="url" runat="server" ></asp:TextBox> </td> </tr> <tr> <td> Email : </td> <td> <asp:TextBox ID="TextBox3" CssClass="email" runat="server" ></asp:TextBox> </td> </tr> <tr> <td> Date : </td> <td> <asp:TextBox ID="TextBox4" CssClass="date" runat="server" ></asp:TextBox> </td> </tr> <tr> <td> </td> <td> <asp:Button ID="btnSave" runat="server" Text="Submit" /> </td> </tr> </table> </fieldset> </div> </form> </body> </html>