jQuery validate custom remote method fired just one time

Question

I created a custom method which remotely checks the validity of the email returning different messages based on two cases. I works just the first time the validation started, if I change the input value another time the result reimans the same, it's like the method is ignored.

this is my code

var validateEmailMessage = '';
jQuery.validator.addMethod("checkmail", function (value, element) {
    $.ajax({
        type: 'POST',
        url: '/join/check-email/',
        data: { email: value },
        success: function (data) {
            var data = JSON.parse(data);
            if (data['response'] == 'ok') {
                return true;
            } else {
                if (data['response'] == 'already') {
                    validateEmailMessage = 'This email has already been used';
                }
                if (data['response'] == 'notvalid') {
                    validateEmailMessage = 'This email is not valid';
                }
                return false;
            }
        }
    });

}, function () { return validateEmailMessage });


$("#frm_join").validate({
    rules: {
        first_name: {
            required: true,
        },
        last_name: {
            required: true,
        },
        email: {
            checkmail: true,
            required: true,
            email: true
        },
        pass: {
            required: true,
            alphaNumeric: true,
            minlength: {
                param: 8
            }
        },
        pass_confirm: {
            required: true,
            minlength: {
                param: 8
            },
            equalTo: {
                param: "#pass"
            }
        }
    },
    messages: {
        ...
    },
    submitHandler: function (form) {
                ...
    }
});

The PHP part returns a json response like {"response": "ok"}

Checking the console, the method is called and returns each time the correct true or false response, but the input remains the same with the error message below or valid (depends on what I tried the first time)

Frank Vèssia · Answer 1 · 2023-08-11T07:29:12.143

I solved changing completely approach, using the default remote option like this:

remote: {
        type: 'POST',
        url: '/join/check-email/', 
        dataType: 'json',
        data: {
            email: function () { return $('#email').val(); }
        },
        dataFilter: function(data) {
            var json = JSON.parse(data);
            if(json.response != 'ok') {
                return "\"" + json.response + "\"";
            } else {
                return true;
            }

        }
    }

jQuery validate custom remote method fired just one time

1 Answers1