- jQuery Password Validation Doesn't Work Completely
- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
- "http://www.w3.org/TR/html4/strict.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>Users</title>
- <script src="js/jquery-1.7.2.js"></script>
- <script src="js/login.js"></script>
- <script src="js/buildsit.js"></script>
- <script src="js/buttons.js"></script>
- <script src="js/jquery.url.js"></script>
- <link rel="stylesheet" type="text/css" media="screen" href="css/jquery.validate.password.css" />
- <script type="text/javascript" src="js/jquery.validate.js"></script>
- <script type="text/javascript" src="js/jquery.validate.password.js"></script>
- <link type="text/css" rel="stylesheet" href="css/main.css" />
- <meta name="author" content="rotem" />
- <script id="demo" type="text/javascript">
- $(document).ready(function() {
- console.debug("validate");
- // validate signup form on keyup and submit
- $("#changePwd").validate({
- rules: {
- prevPwd: {
- required: true,
- },
- newPwd: {
- required: true,
- password: "#prevPwd"
- },
- confPwd: {
- required: true,
- equalTo: "#newPwd"
- }
- },
- messages: {
- confPwd: {
- required: "Repeat your password",
- minlength: jQuery.format("Enter at least {0} characters"),
- equalTo: "Enter the same password as above"
- }
- },
- // the errorPlacement has to take the table layout into account
- errorPlacement: function(error, element) {
- error.prependTo( element.parent().next() );
- },
- // specifying a submitHandler prevents the default submit, good for the demo
- submitHandler: function() {
- alert("submitted!");
- },
- // set this class to error-labels to indicate valid fields
- success: function(label) {
- // set as text for IE
- console.debug("success!!!");
- label.html(" ").addClass("checked");
- }
- });
- console.debug("validate");
- $("#newPwd").valid();
- $("#confPwd").valid();
- });
- </script>
- <!-- Date: 2012-04-18 -->
- </head>
- <body>
- <div class="wrap">
- <div class="header">
- </div>
- <div class="contentContainer">
- <div class="sideMenu">
- </div>
- <div class="content">
- <form id="changPwd">
- <table>
- <tr>
- <td>
- <label for="email">Email:</label>
- </td>
- <td>
- <input type="text" id="email" name="email" value="admin"/>
- </td>
- </tr>
- <tr>
- <td>
- <label for="prevPwd">Previous Password:</label>
- </td>
- <td>
- <input id="prevPwd" name="prevPwd" type="password"/>
- </td>
- </tr>
- <tr>
- <td>
- <label for="newPwd">New Password:</label>
- </td>
- <td>
- <input id="newPwd" name="newPwd" type="password" class="password error"/>
- <label for="newPwd" generated="true" class="error" style="display: inline; "/>
- </td>
- <td>
- <div class="password-meter">
- <div class="password-meter-message password-meter-message-weak">Weak</div>
- <div id="passwordStrengthDiv" class="password-meter-bg">
- <div class="password-meter-bar password-meter-weak"/>
- </div>
- </div>
- </td>
- </tr>
- <tr>
- <td>
- <label for"confpwd"="">Confirm Password:</label>
- </td>
- <td>
- <input id="confPwd" name="confPwd" type="password"/>
- </td>
- </tr>
- <tr>
- <td/>
- <td>
- <input type="submit"/>
- </td>
- </tr>
- </table>
- </form>
- </div>
- </div>
- </div>
- <script type="text/javascript">
- buildSite();
- buildEditUsers();
- </script>
- </body>
- </html>