jQuery validator and datepicker click not validating

by

Quote OP:

“I have to select the datepicker twice. ie; 1 click to select and it inputs the data correctly. 2nd click to clear the error message.”

That’s because validation is normally triggered on keyup and blur events. Since you’re using a date-picker to interact with the field, rather than the keyboard, you’re interfering with the normal triggering events.

Your code is supposed to compensate, but is over-kill…

$(function() {
        $("#datepicker").datepicker({ ... })
.on('changeDate', function(ev) {
    if($('#datepicker').valid()){
       $('#datepicker').removeClass('invalid').addClass('success');   
    }
 });
    });

You only need to call the .valid() method on the field whenever the value changes.

$(function() {
    $("#datepicker").datepicker({ ... })
        .on('changeDate', function(ev) {
            $(this).valid();  // triggers the validation test
            // '$(this)' refers to '$("#datepicker")'
        });
});

However, this is basically the same as you had before.

What is changeDate supposed to be? Is this something defined by your datepicker plugin? That’s not a standard jQuery event, so likely the whole problem. Try the standard change event instead….

$(function() {
    $("#datepicker").datepicker({
        changeMonth: true,
        changeYear: true,
        yearRange: '2011:2037',
        dateFormat: 'dd/mm/yy',
        minDate: 0,
        defaultDate: null
    }).on('change', function() {
        $(this).valid();  // triggers the validation test
        // '$(this)' refers to '$("#datepicker")'
    });
});

More Related Contents:

  1. jQuery validate: How to add a rule for regular expression validation?
  2. Validate that end date is greater than start date with jQuery
  3. jQuery Validation Plugin – adding rules that apply to multiple fields
  4. jQuery Validate array input element which is created dynamically
  5. Using JQuery Validate Plugin to validate multiple form fields with identical names
  6. jQuery validator and a custom rule that uses AJAX
  7. jQuery form validation on button click
  8. jQuery validate dynamic input array
  9. Unobtrusive validation in Chrome won’t validate with dd/mm/yyyy
  10. jQuery Validate plugin – password check – minimum requirements – Regex
  11. How can we specify rules for jQuery validation plugin by class?
  12. how to test Recaptcha with jQuery Validate plugin
  13. jQuery Validation – Two fields, only required to fill in one
  14. jQuery Validation plugin won’t validate when in click event handler of
  15. Limit number of characters in input field
  16. Placing error message for a checkbox array
  17. select2 and jquery validation not working properly
  18. jQuery select box validation
  19. Validate dynamic field jquery
  20. jQuery Validation with multi-part form
  21. Ignore all hidden div but not one in jQuery validation
  22. JQuery Validate multiple fields with one error
  23. How to make select2 work with jquery.validation plugin?
  24. jquery validation: prevent form submit
  25. Validating array inputs using jquery validation plugin
  26. JQuery.validate – one rule on blur only; the rest should be normal?
  27. JQuery validation-select required if checkbox checked
  28. validation for at least one checkbox
  29. jQuery validate plugin : accept letters only?
  30. jQuery validation onblur

Leave a Comment