JQuery Validation plugin is very easy to use and has the advantage of being highly customizable both in functionality, such as validation rules. The purpose of this tutorial is a few lines of JavaScript specify the form and apply the validation plugin.
When it comes to client-side validate asp.net form, jQuery Validation plugin is one of the best in business. Here, I am trying to show you how to use jQuery Validation plugin in Asp.Net Form.
Step 1:
You need jQuery library and jQuery Validation plugin
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.5.5/jquery.validate.min.js"></script>
Step 2:
The easiest way to specify validation rules is to add classes to form elements
<form id="form1" runat="server" > <asp:TextBox ID="txtName" runat="server" class="required" ></asp:TextBox> <asp:TextBox ID="txtage" runat="server" class="required number" minlength="2"></asp:TextBox> <asp:TextBox ID="txtEmail" runat="server" class="required email"></asp:TextBox> <asp:TextBox ID="txtPass" runat="server" TextMode="Password" class="required"></asp:TextBox> <asp:TextBox ID="txtRePass" runat="server" TextMode="Password" equalto="#txtPass" class="required" ></asp:TextBox> <asp:TextBox ID="txtUrl" runat="server" class="required url">http://</asp:TextBox> <asp:Button ID="btnSubmit" runat="server" Text="submit" /> </form>
Above form you may notice that I added class “required”, “number”, “email” etc.. and attribute equalto , minlength etc..
txtName :::
required – value required
txtage ::
required number – valid number required
minlength=”2″ – min two digit required
txtEmail::
required email – valid email required
txtRePass::
equalto – txtRePass value must equal to txtPass
txtUrl::
required url – valid Url required
[ad#inpost]
Step 3:
Use validate() of jQuery validation plugin on asp.net form.
<script type="text/javascript"> $(document).ready(function () { $("#form1").validate(); }); </script>
UPDATE:
Asp.Net Form Validation Part 2 using JQuery Validation and meta Plugin
Thanks
[…] Asp.Net Form Validation using jQuery Validation Plugin article, I explain how to use JQuery Validation Plugin in asp.net […]