Плагин проверки jQuery + equalTo не работает

Вот что я сейчас использую, чтобы попытаться проверить форму. Когда я нажимаю кнопку отправки без значений, введенных в форму, я получаю сообщения об ошибках для каждого из входов, как ожидалось. Однако, независимо от того, что я ввел в newpassword2 или newemail2, они никогда не проходят проверку. Я пробовал все: от копирования и вставки до того, чтобы сделать их по одному букве без успеха. Возможно, я неправильно использую атрибут equalTo...

Я также проверил, что все имена селекторов согласуются с идентификатором ввода в форме. Кроме того, все входы содержатся в форме, поэтому нет никаких внешних тегов формы (я читал, что это была проблема с кем-то еще).

$(document).ready(function() { 
    $("#account_data").validate({ 
        rules: { 
            newpassword1: { required: true }, 
            newpassword2: { equalTo: "#newpassword1" },
            newemail1: { required: true, email: true },
            newemail2: { equalTo: "#newemail1" }
        }
    }); 
});

Любая помощь будет чрезвычайно оценена!

СПАСИБО!!!

-Т -

Ответы

Ответ 1

Если вы будете использовать id = "password", это не сработает. Вы должны использовать другое имя для id.

Все ключи в объекте правил относятся к input.name, а не input.id

Ответ 2

При использовании equalTo вы должны использовать имя и идентификатор формы. Например:

<input type="password" name="password" id="password" value="" />
<input type="password" name="password_mirror" value="" />

$("#register_user").validate({
        rules: {
            'password_mirror': {
                minlength: 5,
                equalTo: "#password"
            }
        },
        messages: {
            'password_mirror': {
                minlength: "Your password must be at least 5 characters long",
                equalTo: "Please enter the same password as above"
            }
        }
    });

Ответ 3

У меня была такая же проблема, как у Тома. Решение заключалось в создании идентификатора для полей пароля, соответствующих именам полей пароля. (Как упомянул Том). Определенно ошибка в коде проверки, потому что он должен просто полагаться на поле имени. О, хорошо...

Грег

Ответ 4

@Попробуйте

        newpassword1: { required: true }, 
        newpassword2: { required: true,equalTo: "#newpassword1"},
        newemail1: { required: true, email: true },
        newemail2: { required: true,email: true ,equalTo: "#newemail1" }

или используйте последнюю версию плагина проверки

Теперь правила добавлены с обязательным паролем, установленным в true, а второе условие - для параметра password_again, установленного в требуемое значение true, и оно должно "равное" для поля ввода с идентификатором пароля. С учетом этих условий мы можем достичь того, чего хотим. Не забудьте проверить демонстрацию сообщения, чтобы узнать, как он работает. Для получения дополнительной документации и ресурсов в этом плагине посетите плагин JQuery Validation

Ответ 5

Перед использованием "equalTo" нам нужно позаботиться о следующих моментах:

  • Используйте другое слово для имени входного элемента и идентификатора.

  • Используйте идентификатор входного элемента в совпадении "equalTo" вместо имени входного элемента:

<html>
<head>
    <title></title>
    <script src="jquery-1.12.0.min.js"></script>
    <script src="jquery.validate.min.js"></script>
    <script>
            $(document).ready(function(){
                  $('#btnSubmit').click(function(){
                       $("form").validate({
                         rules: {
                            pwd: {
                                 required: true,
                                 minlength : 6
                             },
                            conf_pwd: {
                                   required: true,
                                   minlength : 6,
                                   equalTo: "#id_pwd"
                                 }
                        },
                        messages: {
                               pwd: {
                                  required: "Please enter the password.",
                                  minlength: "Your password must be at least 6 characters long"
                                },
                              conf_pwd: {
                                 required: "Please enter the confirm password.",
                                 minlength: "Your password must be at least 6 characters long",
                                 equalTo: "Please enter the same password as above"
                              }
                       },
                       submitHandler: function(form) {
                                 form.submit();
                        }
            });
                  });
            });
    </script>
</head>
<body>
       <div>
        <form id="data" action="" method="post">
        <div class="form-group row">
        <label>Password:</label>
            <div>
            <input id="id_pwd" name="pwd" type="password" />
           </div>
        </div>
        <div>
        <label>Confirm Password:</label>
            <div>
            <input id="id_conf_pwd" name="conf_pwd" type="password" />
           </div>
        </div>
        <div>
        <div>
            <div>
		    <input type="submit"  id="btnSubmit" name="submit" value="Reset Password">
	       </div>
        </div>
       </div>
    </form>
       </div>
</body>
</html>