Compare two html-password-fields with JQuery-validation

Just to remember how easy it is with jquery-validation 🙂

jquery_password_validator

<html>
	<head>
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
		<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
                <script src="test.js"></script>
	</head>
	
	<body>
		<form name="register_form" id="register_form">
			username <input type="text" id="username" name="username" /> <br/>
			password <input type="password" id="pw1" name="pw1" /> <br />
			password <input type="password" id="pw2" name="pw2" /> <br />
			<input type="submit" value="submit" onclick="validateForm()" />
		</form>
	</body>
</html>
function validateForm() {
    jQuery.validator.addMethod(
        "password_check", 
        function() {
            var p1 = $("#pw1").val();
            var p2 = $("#pw2").val();
            if ( p1 == p2 ){
                return true;
            } else {
                return false;
            }
        }, 
        "Passwords do not match."
        );

    //check the form
    $("#register_form").validate({
        rules: {
            username: "required",
            pw1: "required",
            pw2: "password_check"
        },
        submitHandler: function(form) {
            form.submit();
        }
    });
}