Jquery checking that passwords match with php + Json

Question

I have a form that I am validating with JS and PHP. Everything is going well so far apart from when I try to check if the passwords match.

Here is the form:

<div>
                    <label for="passlength">Password, valid: 0-9</label>
                    <input type="text" name="passlength" value="<?=@$_REQUEST['passlength']?>" id="passlength" />
                    <span id="validatePasslength"><?php if ($error) { echo $error['msg']; } ?></span>
                </div>
                <div>
                    <label for="passlength">Password2, valid: 0-9</label>
                    <input type="text" name="passlength2" value="<?=@$_REQUEST['passlength2']?>" id="passlength2" />
                    <span id="validatePasslength2"><?php if ($error) { echo $error['msg']; } ?></span>
                </div>

This is the Javascript:

    var r = $('#passlength').val()
;
        var validatePasslength2 = $('#validatePasslength2');
        $('#passlength2').keyup(function () {

            var t = this;
            if (this.value != this.lastValue) {
                if (this.timer) clearTimeout(this.timer);
                validatePasslength2.removeClass('error').html('<img src="../../images/layout/busy.gif" height="16" width="16" /> checking availability...');

                this.timer = setTimeout(function () {
                    $.ajax({
                        url: 'ajax-validation.php',
                        data: 'action=check_passlength2&passlength=' + r + '&passlength2=' + t.value,
                        dataType: 'json',
                        type: 'post',
                        success: function (j) {
                            validatePasslength2.html(j.msg);
                        }
                    });
                }, 200);
                this.lastValue = this.value;
            }
        });

Here is the php:

//Check for passlength
        if (@$_REQUEST['action'] == 'check_passlength' && isset($_SERVER['HTTP_X_REQUESTED_WITH'])) {
        // means it was requested via Ajax
        echo json_encode(check_passlength($_REQUEST['passlength']));
        exit; // only print out the json version of the response
    }

    function check_passlength($password) {
//        global $taken_usernames, $usersql;
        $resp = array();
//        $password = trim($password);
      if (!preg_match('/^[0-9]{1,30}$/', $password)) {
        $resp = array("ok" => false, "msg" => "0-9 Only");
    } else if (preg_match('/^[0-9]{1,2}$/', $password)) {
                        $resp = array("ok" => false, "msg" => "Password too short");
        } else if (preg_match('/^[0-9]{6,30}$/', $password)) {
                                $resp = array("ok" => false, "msg" => "Password too long");
    } else {
        $resp = array("ok" => true, "msg" => "Password ok");
    } 

        return $resp;
    }


//Check for passlength2
        if (@$_REQUEST['action'] == 'check_passlength2' && isset($_SERVER['HTTP_X_REQUESTED_WITH'])) {
        // means it was requested via Ajax
        echo json_encode(check_passlength2($_REQUEST['passlength'],$_REQUEST['passlength2']));
        exit; // only print out the json version of the response
    }

    function check_passlength2($password,$password2) {
//        global $taken_usernames, $usersql;
        $resp = array();
//        $password = trim($password);
      if (!preg_match('/^[0-9]{1,30}$/', $password2)) {
                $resp = array("ok" => false, "msg" => "0-9 Only");
        } else if (preg_match('/^[0-9]{1,2}$/', $password2)) {
                                $resp = array("ok" => false, "msg" => "Password too short");
        } else if (preg_match('/^[0-9]{6,30}$/', $password2)) {
                                $resp = array("ok" => false, "msg" => "Password too long");
        } else if ($password !== $password2) {
                                $resp = array("ok" => false, "msg" => "Passwords do not match");
        } else {
                $resp = array("ok" => true, "msg" => "Password ok");
        }

        return $resp;
    }

I am pretty sure it is an issue with the javascript because if I set var r = 1234; It works. Any ideas??

Answer 1

You just want to see if the passwords match, and are between a min and max length? Isn't the above overkill? Am I missing something?

You could use js alone to check the length of the first password field, then in the onblur event of the second field, check to see if field1==field2.

Minor thing I noticed, the label for the second field has the wrong "for" attribute.