CODEWITHSUNDEEP
jqueryvalidationdatepicker
user2798785
user2798785

Reputation: 11

How to solve Jquery Datepicker Validation issue?

I did jquery validation on my form in play framework which is working properly when i directly click on submit button without entering values in textboxes validation messages come. But the issue is, when i am selecting a date from datepicker(bootstrap-datepicker.js), validation message does not disappear for date field. after clicking twice it disappears. please help me.

Jquery Code:
$("form input.date").datepicker({
        autoclose: true,
        onClose: function() {
            $(this).valid();
        }

});

Validation Function:
$("#register").validate({
        focusCleanup: true,
        rules: {
            name: "required",
            email: {
                required: true,
                email: true
            },
            phone: {
                required: true,
                number:true,
                minlength:10,
                maxlength:10
            },                
            date:{
                required: true,
                date: true
            }                
        },
        messages: {
            name: "Please provide your full name",
            email: {
                required: "Please provide your email address",
                email: "Please provide a valid email address"
            },
            phone: {
                required: "Please provide your mobile number",
                number: "Please provide a valid mobile number",
                minlength:"Please provide a valid mobile number",
                maxlength:"Please provide a valid mobile number"
            },               
            date: {
                required: "Please select date ",
                date: "Please select valid date"
            }                
        },
        submitHandler: function(form) {
        }
});

Upvotes: 0

Views: 2671

Answers (2)

MJ_Wales
MJ_Wales

Reputation: 893

I experienced the same issue and found a solution here: jQuery validator and datepicker click not validating

Op was very close, issue resolved with following (modified) code from user Sparky:

   $("#datepicker").datepicker({
         autoclose: true,
         dateFormat: 'dd/mm/yy',
   }).change(function() {
         $(this).valid();  // triggers the validation test        
   });

Upvotes: 1

gandalf
gandalf

Reputation: 470

you should specify when your validation function will be executed, there is 'keyup' which execute your function when you finish the inputs filling. this is the documentation keyup. you verify your the date and if it's correct you use the function hide(), but remember the validation code should be inside keyup()

Upvotes: 0

Related Questions