Asp.Net Form Validation Part 2 using JQuery Validation and meta Plugin

In Asp.Net Form Validation using jQuery Validation Plugin article, I explain how to use JQuery Validation Plugin in asp.net form.
Now here I will show you how to use meta plugin with jQuery Validation to validate ASP.NET form. Using Meta plugin we can right rules and message into class attribute of input.
we using same example which we used in previous article.

Step 1:

You need jQuery library, jQuery Validation plugin and meta plugin

1 2 3

<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.<span class="IL_AD" id="IL_AD2">microsoft</span>.com/ajax/jquery.validate/1.5.5/jquery.validate.min.js"></script> <script type="text/javascript" src="http://jquery-multifile-plugin.googlecode.com/svn-history/r16/trunk/jquery.MetaData.js"></script>

Step 2:

1 2 3 4 5 6 7 8 9

<form id="form1" runat="server"> <asp:<span class="IL_AD" id="IL_AD12">TextBox</span> ID="txtName" runat="server" class="{<span class="IL_AD" id="IL_AD3">required</span>:true,messages:{required:'required.'}}" ></asp:TextBox> <asp:TextBox ID="txtage" runat="server" class="{required:true,number:true,minlength:2, messages:{required:'required.',number: 'number Only!' , minlength:'mininum 2 characters.'}}" ></asp:TextBox> <asp:TextBox ID="txtEmail" runat="server" class="{required:true, email:true,messages:{required:'required.',email: 'invalid email!' }}"></asp:TextBox> <asp:TextBox ID="txtPass" runat="server" TextMode="Password"  class="{required:true,messages:{required:'required.'}}"></asp:TextBox> <asp:TextBox ID="txtRePass" runat="server" TextMode="Password" class="{required:true, equalTo:'#txtPass',  messages:{required:'This field is required.', equalTo:'Value entered in this field should equal to value of Password field.'}}" ></asp:TextBox> <asp:TextBox ID="txtUrl" runat="server" class="{required:true,url:true,messages:{required:'required.',url:'not vaild url'}}">http://</asp:TextBox> <asp:Button ID="btnSubmit" runat="server" Text="submit" /> </form>

Step 3:

Use validate() of jQuery validation plugin on asp.net form.

1 2 3 4 5

<script type="text/javascript">         $(document).ready(function () {         $("#form1").validate();                                   }); </script>