jQuery 验证不会确认密码确认

Question

我正在尝试构建一个表单来重置密码。它使用 jquery validation。密码具有 6 个字符的要求有效，但密码确认总是显示 "please insert same value"，即使它具有相同的值。有什么想法吗？

这是 resetpwd.js，使用了 HTML：

var LoginForm = function() {

  // Login form validation
  var handleValidation = function() {

    // for more info visit the official plugin documentation:
    // http://docs.jquery.com/Plugins/Validation
    var form = $('#resetpwd');

    form.validate({
      errorElement: 'span', //default input error message container
      errorClass: 'help-block help-block-error', // default input error message class
      focusInvalid: false, // do not focus the last invalid input
      ignore: "", // validate all fields including form hidden input
      rules: {
        password: {
          minlength: 6,
          required: true
        },
        password_confirmation: {
          equalTo: "#password"
        }
      },

      highlight: function(element) { // hightlight error inputs
        $(element)
          .closest('.form-group').addClass('has-danger'); // set danger class to the control group
      },

      unhighlight: function(element) { // revert the change done by hightlight
        $(element)
          .closest('.form-group').removeClass('has-danger'); // set danger class to the control group
      },

      success: function(label) {
        label
          .closest('.form-group').removeClass('has-danger'); // set success class to the control group
      },
    });

  };


  return {
    //main function to initiate the module
    init: function() {
      handleValidation();
    }
  };

}();

jQuery(document).ready(function() {
  LoginForm.init();
});

@extends('admin.layouts.layout-resetpassword')
@section('scripts')
    <script src="/assets/admin/js/sessions/resetpwd.js"></script>
@stop

@section('content')
<form action="{{route('login.post')}}" id="resetpwd" method="post">
  {{csrf_field()}}
  <div class="form-group">
    <input type="password" class="form-control form-control-danger" placeholder="Neues Passwort" name="password">
  </div>
  <div class="form-group">
    <input type="password" class="form-control form-control-danger" placeholder="Passwort wiederholen" name="password_confirmation">
  </div>
  <button class="btn btn-theme btn-full">Speichern</button>
</form>
@stop

Answer 1

您的代码引用了#password，它正在寻找 ID 为 password 的对象。如下所示将其添加到您的输入中，它应该可以工作。

@extends('admin.layouts.layout-resetpassword')

@section('scripts')
    <script src="/assets/admin/js/sessions/resetpwd.js"></script>
@stop

@section('content')
    <form action="{{route('login.post')}}" id="resetpwd" method="post">
        {{csrf_field()}}
        <div class="form-group">
            <input type="password" class="form-control form-control-danger" placeholder="Neues Passwort" name="password" id="password">
        </div>
        <div class="form-group">
            <input type="password" class="form-control form-control-danger" placeholder="Passwort wiederholen" name="password_confirmation" id="password_confirmation">
        </div>
        <button class="btn btn-theme btn-full">Speichern</button>
    </form>
@stop

Answer 2

问题是密码元素没有您提到的等于

的ID

试试这个

 <div class="form-group">
            <input type="password" class="form-control form-control-danger" placeholder="Neues Passwort" name="password" id="password">
        </div>
        <div class="form-group">
            <input type="password" class="form-control form-control-danger" placeholder="Passwort wiederholen" name="password_confirmation" id="password_confirmation">
        </div>

jQuery 验证不会确认密码确认

jQuery validation won't acknowledge the password confirmation

javascript

jquery

laravel

blade