Client side date validation using jQuery plugins

31 / Mar / 2010 by Bhagwat Kumar 6 comments

I have been facing problem of validating a text input field for a valid date. We are using two popular jquery plugins : jQuery validation and jQuery UI datepicker for client side validation.

I googled it and found a good solution here http://stackoverflow.com/questions/511439/custom-date-format-with-jquery-validation-plugin but it was validating only the formatting i.e. 30-Feb-2010 is a valid date if the formating string was dd-MMM-yyyy. In our case 30-Feb-2010 should be invalid date.

The solution I got is to define custom validator for date as shown below :


Now I am able to use this custom validator as :


Hope it helps you.

~~~ Bhagwat Kumar ~~~~
bhagwat@intelligrape.com

FOUND THIS USEFUL? SHARE IT

comments (6)

  1. storenvy.com

    If you want to grow your experience just keep visiting this web page and be updated with the hottest news update posted here.

    Reply
  2. Eugo

    @virendra: true, but then you have to write all the cases for each date format. I only modified the above script to insert my variable for the date format string, and put my selector (to cover all the date fields I may have) and it just worked for each date format I may have.

    So if you aren’t using the validation plugin, of course you need to roll your own.

    Reply
  3. Virendra

    Well your article is good and useful when someone is using validation plugin. But I encounter the same problem where I need to validate the date but I am not using the validation plugin. Looking for a solution which works without validation plugin. After some googling found a function which actually returns true or false based on the input.

    Thanks

    Reply
  4. Kerrie

    Thanks so much for posting this, but I’m still having problems getting it all to work. Can you possible show me a “sample” of your finished page? Thank you so much.

    Reply

Leave a Reply to Bhagwat Kumar Cancel reply

Your email address will not be published. Required fields are marked *