Trying to get addMethod in jquery validation to work. console.log shows the proper response, but it always fails validation

Question

I am using data attributes for jQuery Validation plugin. I need to use the "remote" validation function, however, I need to modify the data being sent to the remote location depending on the form it is used on. I want to use data attributes and not create a <script> call for each form.

I created a custom $.validator.addMethod to handle this, but every time I run it, the form comes back like it is returning false. I added a call to console.log() to make sure that the data is returning either true or false based on the remote script and it is. It returns true when it should and false when it should.

Here is my custom addMethod:

$.validator.addMethod("dupcheck", function(value,element){
    var method = element.getAttribute("data-method");
    var data = { "dupcheckv" : value, "dupcheckm" : method };
    $.post( "duplicate-check.php", data).done(function(response){
        console.log(response);
        return response;
    });
});

I did take a look at how to make a jquery “$.post” request synchronous [duplicate] , but async:false is deprecated so that doesn't help.

i doubt this one has async support but try returning $.post( ... — joyBlanks, Sep 05 '19 at 23:28
@joyBlanks so you’re saying put a return in front of $.post? `return $.post(` — tvirelli, Sep 05 '19 at 23:46
No need to post answer in two places. Below as an actual answer preferred. Edited. Thanks. — Sparky, Sep 07 '19 at 19:17

score 0 · Accepted Answer · answered Sep 06 '19 at 02:45

I got it working by copying all of the remote function and put it in the addMethod call:

$.validator.addMethod("dupcheck", function(value, element, param, method){
    if ( this.optional( element ) ) {
        return "dependency-mismatch";
    }

    method = typeof method === "string" && method || "dupcheck";

    var previous = this.previousValue( element, method ),
        validator, data, optionDataString;

    if ( !this.settings.messages[ element.name ] ) {
        this.settings.messages[ element.name ] = {};
    }
    previous.originalMessage = previous.originalMessage || this.settings.messages[ element.name ][ method ];
    this.settings.messages[ element.name ][ method ] = previous.message;

    param = typeof param === "string" && { url: param } || param;
    optionDataString = $.param( $.extend( { data: value }, param.data ) );
    if ( previous.old === optionDataString ) {
        return previous.valid;
    }

    previous.old = optionDataString;
    validator = this;
    this.startRequest( element );
    data = {};
    data[ "dupcheckv" ] = value;
    data[ "dupcheckm" ] = element.getAttribute("data-method");
    $.ajax( $.extend( true, {
        mode: "abort",
        port: "validate" + element.name,
        dataType: "json",
        method: "POST",
        data: data,
        context: validator.currentForm,
        success: function( response ) {
            var valid = response === true || response === "true",
                errors, message, submitted;

            validator.settings.messages[ element.name ][ method ] = previous.originalMessage;
            if ( valid ) {
                submitted = validator.formSubmitted;
                validator.resetInternals();
                validator.toHide = validator.errorsFor( element );
                validator.formSubmitted = submitted;
                validator.successList.push( element );
                validator.invalid[ element.name ] = false;
                validator.showErrors();
            } else {
                errors = {};
                message = response || validator.defaultMessage( element, { method: method, parameters: value } );
                errors[ element.name ] = previous.message = message;
                validator.invalid[ element.name ] = true;
                validator.showErrors( errors );
            }
            previous.valid = valid;
            validator.stopRequest( element, valid );
        }
    }, param ) );

    return "pending";
});

Trying to get addMethod in jquery validation to work. console.log shows the proper response, but it always fails validation

1 Answers1