jQuery datepicker validation message issue

Abhishek picture Abhishek · Feb 18, 2010 · Viewed 20.4k times · Source

I'm using the jquery datepicker plugin at http://plugins.jquery.com/project/datepick with the datepicker validation plugin.

<script id="frmValidation" type="text/javascript">

$(document).ready(function(){
    var validator = $("#frmTest").validate({
        rules:{
            fname: "required",
            dobPicker: "required" 
        },
        messages:{
            fname: "Please enter a name",
            dobPicker: "Select a date"
        },

    });
    $('#dobPicker').datepick();
    $.datepick.setDefaults({showOn: 'both', dateFormat: 'dd-mm-yy', yearRange:'1900:2010'});
});
</script>

And the body of the document is as follows :

<form id="frmTest" action="" method="post">
<div id="error-list"></div>
<div class="form-row">
<span class="label"><label for="fname">Name</label></span>
<input type="text" name="fname" />
</div>
<div class="form-row">
<span class="label"><label for="dobPicker">DOB</label></span>
<input type="text" id="dobPicker" name="dobPicker" style="margin-left: 4px;"/>
</div>
<div class="form-row">
<input type="submit" name="submit" value="submit"/>
</div>
</form>

The form validates the first time but the error message for the datepicker does not disappear immediately a date is selected.. however it goes away if the date is selected the second time. Any help to make it go the first time a date is selected will be appreciated

Answer

Andrew Roazen picture Andrew Roazen · Mar 26, 2010

You want to set this in your datepicker defaults:

onClose: function() {$(this).valid();},

As soon as another date is selected it will make the validator plugin recheck the field.