Question

This is using jQuery 1.6.1 and Validate 1.8.1.

I have been banging my head against a wall because of this problem, and now I’m trying the other approach to try and solve this problem. I need to query the database for existing usernames so that someone signing up doesn’t register the same one again.

HTML:

<form class="cmxform" action="register.php" method="post" name="signup" id="signup">
   <ul>
      <li>
        <label for="username">Username: <em>*</em></label>
        <input type="text" id="username" name="Username" size="20" class="required" placeholder="Username" />
      </li>
   </ul>
</form>

This time, I’m trying to use the remote function for the validate script:

    $("#signup").validate( {
        var username = $("#username").val();
        rules: {
            Username: {
                required: true,
                minlength: 5,
                remote: {
                    url: "dbquery.php",
                    type: "GET",
                    async: false,
                    data: "action=checkusername&username="+username,
                    success: function (output) {
                            return output;
                    }
                }
            }
        },
        messages: {
            Username: {
                required: "Enter a username",
                remote: jQuery.format("Sorry, {0} is not available")
            },
        },
        submitHandler: function(form) {
            form.submit();
        }
    });

The code in question that doesn’t work is var username = = $("#uname").val();. Firebug gives the error missing : after property id.

I’m including the mentioned variable above inside validate() because I only want the value of the input after I’ve typed something into it, not upon loading of the page.

The other problem I’ve been running into is making the remote error message ONLY show up when a username already exists in the database. Unfortunately, it shows up whether dbquery.php comes back as true or false. If I try an existing username, it returns false, then I rewrite a new username that returns true, the message doesn’t go away. Similarly, when I write a username and it returns true, I still get the remote error message.

What am I doing wrong?

Answer 1

As you can read How can I force jQuery Validate to check for duplicate username in database?

The solution is to use the remote property:

Example with remote:

$("#signup").validate( {
    rules: {
        username: {
            required: true,
            minlength: 5,
            remote: {
                url: "dbquery.php",
                type: "get",
                data: {
                    action: function () {
                        return "checkusername";
                    },
                    username: function() {
                        var username = $("#username").val();
                        return username;
                    }
                }
            }
        }
    },
    messages: {
        username: {
            required: "Enter a username"
        }
    },
    submitHandler: function(form) {
        form.submit();
    }
});

To set a custom error message your PHP file must return the message instead of false, so echo "Sorry, this user name is not available" in your PHP file.