Jquery-validation: remote method - error message in json response.

Created on 23 May 2012 · 5Comments · Source: jquery-validation/jquery-validation

Trying to get the error message out of the json response.

json is:

{ "isError": "false", "errorMessage": "The User Name you chose is already in use. Please enter another name." }

and the custom method is:

`//Additional validation methods:
var someGlobalVar;
$.validator.addMethod("uniqueUserName", function(value, element) {

  $.ajax({
    type: "POST",
     url: "http://dl.dropbox.com/u/53529463/username.json",
     contentType: "application/json; charset=utf-8",  
    dataType:"json",
    data: "{'" + $('#enterEmail').attr('id') + "': '" + $('#enterEmail').val() + "'}",
    async: false,
    success: function(data) {
        var isError = data.isError;
        someGlobalVar = "\"",
        + data.errorMessage,
        + "\"";
        if(isError == "true"){
            return false;
        }

    }

 })

}, someGlobalVar); `

but this returns "no message defined for #enterEmail" - any thoughts on how to achieve this?

Source

jasonday

Most helpful comment

Hi, you can use this method here to do this:

form.validate({
    rules: {
        username: {
            required: true,
            remote: {
                url: "users2.json.php",
                dataFilter: function(data) {
                    var json = JSON.parse(data);
                    if(json.status === "success") {
                        return '"true"';
                    }
                    return "\"" + json.error + "\"";
                }
            }
        }
    }
});

mlynch on 23 May 2012

👍2 🎉1

All 5 comments

Hi, you can use this method here to do this:

form.validate({
    rules: {
        username: {
            required: true,
            remote: {
                url: "users2.json.php",
                dataFilter: function(data) {
                    var json = JSON.parse(data);
                    if(json.status === "success") {
                        return '"true"';
                    }
                    return "\"" + json.error + "\"";
                }
            }
        }
    }
});

mlynch on 23 May 2012

👍2 🎉1

I tried that, but the error message was not returning.

I ended up with:
`var response;
$.validator.addMethod("uniqueUserName", function(value, element) {

  $.ajax({
    type: "POST",
     url: "username.json",
     contentType: "application/json; charset=utf-8",  
    dataType:"json",
    data: "{'" + $('#enterEmail').attr('id') + "': '" + $('#enterEmail').val() + "'}",
    async: true,
    success: function(data) {
        var isError = data.isError;
        var uniqueError = data.errorMessage;
        if(isError == "true"){
            var errorLabel = $('#enterEmail').parent('div').find('label.inputError');
            $(errorLabel).empty().append(uniqueError);
            response = false;

        } else {
            $('#enterEmail').parent('div').addClass('inputSuccess');
            response = true;
        }

    }

 })

  return response;

}, "my default message"); `

which is a bit of a hack. Would love to find a cleaner way to accomplish this.

jasonday on 24 May 2012

and now I've got it working, except it never returns a success - only an error (either the one in the json, or the one defined in messages)

jasonday on 24 May 2012

ok, for anyone else, here's what i had to do:

`remote: {
type: "POST",
url: "js/username.json",
contentType: "application/json; charset=utf-8",
dataType:"json",
data: "{'" + $('#enterEmail').attr('id') + "': '" + $('#enterEmail').val() + "'}",
dataFilter: function(data) {
var json = JSON.parse(data);
if(json.isError == "true") {
return """ + json.errorMessage + """;
} else {
return success;
}