Search code examples
jqueryjquery-validate

Why function is not entered

I have the following Jquery custom validation method :

$('#save-event-challenge').off('click').on('click', function (e) {
        let $btn = $(e.target);

        jQuery.validator.addMethod('minTime', function () {
            console.log('kjbkhb');

            let startTimeStamp = new Date($('#challenge_start_date').val() + ' ' + $('#challenge_start_time').val());
            let endTimeStamp = new Date ( $('#challenge_end_date').val() + ' ' + $('#challenge_end_time').val());
            console.log(startTimeStamp.getTime() < endTimeStamp.getTime());
            console.log(startTimeStamp);
            console.log(endTimeStamp);
            return startTimeStamp.getTime() < endTimeStamp.getTime();
        }, 'End Time Should be Greater Than or Equal to Start Time');

        $formChallenge.validate({
            rules: {
                challenge_end_date : {
                    minTime: true,
                },
                challenge_end_time : {
                    minTime: true,
                },
            }
        });

Unless I let the date inputs empty, the addmethod is not entered ('kjbkhb', doesn't appear in console). So to work I must first submit with date inputs empty, the validation errors appear, and after if I complete them, but I let the end time to be less than start time, the error appears. But if I first complete everything and submit, and the hour is not correct, the validation is not made.

Solution

  • Validation needs to be configured before it is triggered.

    In your code, you need to move the validator setup

    jQuery.validator.addMethod('minTime',...

    to before the save click is fired - ideally inside doc.ready

    As-is, based on provided code indentation, you only add the validator method after you have clicked (during the click handler) so the validation doesn't exist when validation first runs (when you click, before your click handler) - but it is there when you click for the second time. So the first time (when not blank) it passes as there's only [required] validation.