JQuery Validate plugin to validate a ASP.NET Form

by Pascal Parent 25. May 2009 09:30

The first time I used the JQuery Validate plugin, it did not work at all, see JQuery Validate odd behaviour with the ASP.NET Script Manager for reason, but perseverance and stubbornness prevailed and I finally created my first JQuery validated ASP.NET Forms contact form. There are a lot of examples out there, though for some odd reason I can never find a decent example of anything to do with ASP.NET Forms and JQuery, so I battled it out.

First and foremost, when using JQuery with forms the this.object.ClientID function is your second best friend, your best friend is the fact that you can have more than one CSS class descriptor in one class, for example the following CssClass="required email" is completely valid, thanks to JQuery’s CSS Selector. This means the you do not have to know the object’s name and that the same behaviour can easely be set to more than one object with ease.

But I digress, though I must be honest I am still learning a lot about JQuery’s ability to make my life easier every day.

The initiation code is simple enough:

<asp:ScriptManager ID="ScriptManagerProxy1" runat="server">
<Scripts>
<asp:ScriptReference Path="~/Assets/Javascript/jquery.validate.pack.js" />
     Scripts>
asp:ScriptManager>
<script language="javascript" type="text/javascript">
     $(document).ready(function() {
$('.error').hide();
$('#<%= this.Page.Form.ClientID %>').validate();
});
script>

A few things worth noticing, I use the ScriptManager for relative path (the ~/ thing), this eases the problems related to maintenance and moving the ASP.NET file will cause no adverse effect, so if like me you want to refactor the path, it’s not an issue. I also hide all error text $('.error').hide() it is recommended to hide any object wit the .error Css selector prior to use. And then register the validation methods where I use this.object.ClientID to ensure that the right object is called, since I make use of MasterPages this is essential.

From here things get even easier, apply the required validation on the object

<asp:TextBox ID="txtEmail" runat="server" CssClass="required email">asp:TextBox>

Though not required, I would advise that, as a standard, the first CSS selector have an actual class in the CSS file. I also set a default class to all of my inputs.

For further built-in and custom validation requirement please head over to JQuery Validate plugin page where you will find the documentation.

Digg It!DZone It!StumbleUponTechnoratiRedditDel.icio.usNewsVineFurlBlinkList

Tags: ,

ASP.NET

JQuery Validate odd behaviour with the ASP.NET Script Manager

by Pascal Parent 24. May 2009 13:06

I discovered the JQuery Validate plugin a while back and could never get it to work in ASP.NET until today and though I have no idea why this the code bellow does not work.

<asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server">
    <CompositeScript>
        <Scripts>
            <asp:ScriptReference Path="~/Assets/Javascript/jquery.validate.pack.js" />
        Scripts>
    CompositeScript>
asp:ScriptManagerProxy>

If the extension is in the <CompositeScript> section it does not work, I will try to figure out why later but if it is removed from the <CompositeScript> it start to work again.

So the resultant code will look like this:

<asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server">
    <Scripts>
       <asp:ScriptReference Path="~/Assets/Javascript/jquery.validate.pack.js" />
    Scripts>
asp:ScriptManagerProxy>
I honestly say that the JQuery Validate plugin is the best validation package I have come across in a while, go and get it.
Digg It!DZone It!StumbleUponTechnoratiRedditDel.icio.usNewsVineFurlBlinkList

Tags: ,

General

Typemock Is Launching The ASP.NET Bundle – Get Free Licenses

by Pascal Parent 19. May 2009 06:59

Unit Testing ASP.NET? ASP.NET unit testing has never been this easy.

Typemock is launching a new product for ASP.NET developers – the ASP.NET Bundle - and for the launch will be giving out FREE licenses to bloggers and their readers.

The ASP.NET Bundle is the ultimate ASP.NET unit testing solution, and offers both Typemock Isolator, a unit test tool and Ivonna, the Isolator add-on for ASP.NET unit testing, for a bargain price.

Typemock Isolator is a leading .NET unit testing tool (C# and VB.NET) for many ‘hard to test’ technologies such as SharePoint, ASP.NET, MVC, WCF, WPF, Silverlight and more. Note that for unit testing Silverlight there is an open source Isolator add-on called SilverUnit.

The first 60 bloggers who will blog this text in their blog and tell us about it, will get a Free Isolator ASP.NET Bundle license (Typemock Isolator + Ivonna). If you post this in an ASP.NET dedicated blog, you'll get a license automatically (even if more than 60 submit) during the first week of this announcement.

Also 8 bloggers will get an additional 2 licenses (each) to give away to their readers / friends.

Go ahead, click the following link for more information on how to get your free license.

Digg It!DZone It!StumbleUponTechnoratiRedditDel.icio.usNewsVineFurlBlinkList

Tags:

General

Forthcoming trip

by Pascal Parent 1. May 2009 15:01

I am going on a trip to discover and rediscover some places and take some great photos I hope. So fro the next 2 weeks this blog is going to be rather quiet.

But head out to by other blog “Only in South Africa” from the 3rd of where I will try to do one post a day on the places I have been to.

You can also check my Flickr account as well as I will be posting the photos there.

Digg It!DZone It!StumbleUponTechnoratiRedditDel.icio.usNewsVineFurlBlinkList

Tags:

General

Disclaimer
The opinions expressed herein are my own personal opinions and do not represent my employer's view in anyway.

© Copyright 2010 The ASP.NET Guy