Ajax Validation Using jquery?

Question

I using jquery validation plugin.

In my form i need to check whether the nick name is already in use or not.

For that they are providing remote key to make ajax call. For me the ajax call is working correctly and returning true or false. But its allowing even if the returned value is false, which should not happen.

My validation code looks like,

$(function() {
    $("#myform").validate({
        rules: {
            fullName: {
                required: true,
                minlength: 5
            },
            nickName: {
                required: true,
                minlength: 4,
                alphaNumeric: true,
                remote: {
                    url: "NickNameChecker",
                    type: "post",
                    data: {
                        nickName: function() {
                        return $("#nickName").val();
                    }},
                    success: function(data) {
                        return data;
                    }
                }
            }
        },
        messages: {
            fullName: {
                required: "Please Enter Your Full Name.",
                minlength: "Full Name should have minimum 5 letters."
            },
            nickName: {
                required: true,
                minlength: "Nick Name should contain minimum 4 letters.",
                remote: "This nickname is already in use."
            }
        }
    });
});

Any suggestions would be appreciative!!!

Thanks!

Solution:

The solution is in my code only.

I just removed the success part and tried. Its working great!

@TamilVendhan: Not an expert on the remote option, but none of the examples I could find showed the success option being specified. — Andrew Whitaker
– Andrew Whitaker, Commented Jan 14, 2011 at 2:52
@ Andrew Whitaker: Give me any of those examples. I ll try to follow them. — user405398
– user405398, Commented Jan 14, 2011 at 2:56
While client side checking is good for user experience, make sure you have a database rule to enforce uniqueness of nicknames, otherwise you're just waiting for a race condition — Jimmy
– Jimmy, Commented Jan 14, 2011 at 3:59

Andrew Whitaker · Accepted Answer · 2011-01-19 21:01:50Z

(Expanded explanation from comment above):

The success option is not valid for jQuery validate's remote validation. You should be able to just specify a URL to access for validation that returns true or a falsy value/error message:

The serverside resource is called via $.ajax (XMLHttpRequest) and gets a key/value pair, corresponding to the name of the validated element and its value as a GET parameter. The response is evaluated as JSON and must be true for valid elements, and can be any false, undefined or null for invalid elements, using the default message; or a string

See the documentation for remote for more information on how to use the option. Your code would probably look something like this:

$(function() {
    $("#myform").validate({
        rules: {
            fullName: {
                required: true,
                minlength: 5
            },
            nickName: {
                required: true,
                minlength: 4,
                alphaNumeric: true,
                remote: {
                    url: "NickNameChecker",
                    type: "post",
                    data: {
                        nickName: function() {
                        return $("#nickName").val();
                    }
                }
            }
        },
        messages: {
            fullName: {
                required: "Please Enter Your Full Name.",
                minlength: "Full Name should have minimum 5 letters."
            },
            nickName: {
                required: true,
                minlength: "Nick Name should contain minimum 4 letters.",
                remote: "This nickname is already in use."
            }
        }
    });
});

getWeberForStackExchange · Accepted Answer · 2013-11-19 23:29:48Z

1

The jQuery Validation team advised another way to handle non-boolean APIs in this GitHub issue.

The proposed method takes advantage of jQuery.ajax()'s dataFilter property.

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 + "\"";
                }
            }
        }
    }
});

answered Nov 19, 2013 at 23:29

getWeberForStackExchange

7481 gold badge13 silver badges25 bronze badges

Collectives™ on Stack Overflow

Ajax Validation Using jquery?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related