CODEWITHSUNDEEP
jqueryajaxvalidation
boje
boje

Reputation: 880

Jquery validation async not working

I have made this function, that seems to work fine, but it return "#" insted of wainting for the AJAX. I have tried to remove the return call, with out look.

It need to wait until the AJAX is finish before return. The JSP is working fine.

What is wrong?

jQuery.validator.addMethod("knidExist", function(value, element) {
    var valid = "#";
      $.ajax({
          async: false,
          type: "POST",
          url: "USER.jsp",
          data: "knid="+value,
          dataType: "html",
          success: function(msg) {
              // if the user exists, it returns a string "true"
              if($.trim(msg) != "true") {
                 //return false;
                 valid = false;  // already exists
              } else {
                 //return true;
                 valid = true;      // username is free to use
              }
          }  
     });
    return valid;
}, 'This USER does not exist');

Upvotes: 1

Views: 4791

Answers (3)

Ajay
Ajay

Reputation: 4251

Making those request types of "Post" type causes the issue. this basically submits the value and did not wait for the response. -try making it of type "get" it will work.

Upvotes: 0

boje
boje

Reputation: 880

I found a method by my self. Almost a complete copy from the remote method but with static message and url. Hope i can help some one.

jQuery.validator.addMethod("userExist", function(value, element, param) {
if ( this.optional(element) )
    return "dependency-mismatch";

var previous = this.previousValue(element);
if (!this.settings.messages[element.name] )
    this.settings.messages[element.name] = {};
previous.originalMessage = this.settings.messages[element.name].remote;
this.settings.messages[element.name].remote = previous.message;

param = typeof param == "string" && {url:param} || param;

if ( this.pending[element.name] ) {
    return "pending";
}
if ( previous.old === value ) {
    return previous.valid;
}

previous.old = value;
var validator = this;
this.startRequest(element);
var data = {};
data["**user**"] = value;
$.ajax($.extend(true, {
    url: "validation.jsp",
    mode: "abort",
    dataType: "json",
    data: data,
    success: function(response) {
        validator.settings.messages[element.name].remote = "**This user do not exist"**;
        var valid = response === true;
        if ( valid ) {
            var submitted = validator.formSubmitted;
            validator.prepareElement(element);
            validator.formSubmitted = submitted;
            validator.successList.push(element);
            validator.showErrors();
        } else {
            var errors = {};
            var message = response || validator.defaultMessage( element, "remote" );
            errors[element.name] = previous.message = $.isFunction(message) ? message(value) : message;
            validator.showErrors(errors);
        }
        previous.valid = valid;
        validator.stopRequest(element, valid);
    }
}, param));
return "pending";
}, "");

Upvotes: 4

Jon
Jon

Reputation: 437554

Instead of adding your own validation method, you need to use the built-in remote validation method instead which is designed exactly for this purpose.

You would use it in a manner like

remote: {
    type: "POST", 
    url: "USER.jsp",  
    data: { knid: value },
}

Check out the examples the docs link to.

Upvotes: 6

Related Questions