Jquery密碼和確認密碼驗證無法正常工作

Question

我正在嘗試驗證新密碼並確認新密碼。 即使我輸入相同的密碼也顯示錯誤，因為密碼必須相同。 請幫我，我做錯了。 下面是我的html和jquery代碼。

HTML表單

<form role="form" id="clientresetpassword" name="clientresetpassword" action="<?php echo site_url('Home/client_password_reset'); ?>" method="post" style="padding: 10px;">
  <div class="row">
     <?php echo validation_errors(); ?>
  </div>
  <div class="form-group">
    <label>Current Password <span class="mandatory"> *</span></label>
    <input type="password" name="curpas" class="form-control" value="<?php echo set_value('curpas'); ?>" placeholder="Enetr Your Current password" required>
  </div>
  <div class="form-group">
    <label>New Password <span class="mandatory"> *</span></label>
    <input type="text" name="newpass" class="form-control" placeholder="Enter Your New Password" value="" required>
  </div>
  <div class="form-group">
    <label>Confirm New Password <span class="mandatory"> *</span></label>
    <input type="password" name="cnfnewpass" class="form-control" placeholder="Confirm New Password" value="" required>
  </div>
  <div class="form-group">
    <input type="password" class="btn btn-primary" name="reset_password" value="Reset Password">
  </div>
</form>

Jquery驗證

(function($,W,D)
{
    var JQUERY4U = {};

    JQUERY4U.UTIL =
    {
        setupFormValidation: function()
        {
            //form validation rules
            $("#clientresetpassword").validate({
                rules: {
                        curpas: {
                            required: true, 
                            minlength : 5,
                            maxlength : 15
                        },
                        newpass:{
                            required: true,
                            minlength: 5,
                            maxlength: 15
                        },
                        cnfnewpass: {
                            required: true,
                            minlength: 5,
                            maxlength: 15,
                            equalTo: "#newpass"
                        },
                     },
                messages: {
                        curpas: {
                            required: "Please enter Password",  
                            minlength: "Password length must be min. of 5 characters long",
                            maxlength: "Password length must not Exceed 15 characters"           
                        },
                        newpass:{
                            required: "Please enter New Password",  
                            minlength: "New Password length must be min. of 5 characters long",
                            maxlength: "New Password length must not Exceed 15 characters"
                        },
                        cnfnewpass: {
                            required: "Please enter Confirm New Password",
                            minlength: "Confirm New Password length must be min. of 5 characters long",
                            maxlength: "Confirm Password length must not Exceed 15 characters",
                            equalTo: "New Password and Confirm New Password must be same"
                        },
                    },
                submitHandler: function(form) {
                    form.submit();
                }
            });
        }
    }

    //when the dom has loaded setup form validation rules
    $(D).ready(function($) {
        JQUERY4U.UTIL.setupFormValidation();
    });

})(jQuery, window, document);

Answer 1

這是問題所在：

equalTo: "#newpass"  // referring it by ID

但沒有提供身份證明：

<input type="text" name="newpass" class="form-control" placeholder="Enter Your New Password" value="" required>

為它提供id屬性。

Answer 2

您必須為新密碼字段設置ID，例如

<input id="newpass" type="text" name="newpass" class="form-control" placeholder="Enter Your New Password" value="" required>

因為你在jQuery驗證中使用了id選擇器，即equalTo: "#newpass"