Problem in using the datepicker in jquery

Question

i have a html form with 3 fields "dateFrom" and "dateto" and iam using the Jquery datepicker for this fields .Iam using form validation plugin and to validate the required fields.

$(document).ready(function(){
 $("#dateFrom").datepicker({ dateFormat: 'dd-M-yy' });
 $("#dateto").datepicker({ dateFormat: 'dd-M-yy' });
});

Markup:

<input id="dateFrom" name="dateFrom" type="text" class="validate[required] TextBox" size="10" readonly=true 
   value='<?php !empty( $_POST[ 'dateFrom' ] ) ? $_POST[ 'dateFrom' ] : ''  ?>' >
<input id="dateFrom" name="dateto" type="text" class="validate[required] TextBox" size="10" readonly=true 
   value='<?php !empty( $_POST[ 'dateto' ] ) ? $_POST[ 'dateto' ] : ''  ?>' >

So My problem is When i select the Datepicker and and select a date it is still giving the error "Required Field" which builds as a prompt to the textbox from the validation plugin But i have entered the date in the textbox. I tried Removing the value attribute for text fields it did not remove the prompt .How do i remove the prompt

Answer 1

Try something like this:

$(document).ready(function(){

    // Checking input value onchange event
    $("input").change(function(){
        if ( $(this).val() != '' ) {
            // action to remove your prompt goes here
            // if you need just to remove class "validate[required]":
            $(this).removeClass('validate[required]');
        }
    });

    $("#dateFrom").datepicker({ dateFormat: 'dd-M-yy' }); 
    $("#dateto").datepicker({ dateFormat: 'dd-M-yy' });

});

This code allows you to check <input /> element value every time you change it. So, if it is empty, we do nothing and you see your prompt, if it is filled in - we remove prompt.