Jquery.Validate Password Equalto - 不显示错误答案

【问题标题】：Jquery.Validate Password Equalto - doesn't display errorJquery.Validate Password Equalto - 不显示错误
【发布时间】：2016-11-01 21:23:34
【问题描述】：

我可以设置Required = true、最小和最大长度，但由于某种原因，当我尝试为 PasswordAgain 字段设置 EqualTo 参数时，即使密码不匹配，表单也允许提交。

    <section>
        <label class="input login-input">
                    <div class="input-group">
                        <span class="input-group-addon"><i class="fa fa-user"></i></span>
                                    <input name="ctl00$ContentPlaceHolder1$ctl01$txtUserName" type="text" id="txtUserName" class="form-control" placeholder="UserName" />
                                </div>
                            </label>
                        </section>
                        <section>
                            <label class="input login-input no-border-top">
                                <div class="input-group">
                                    <span class="input-group-addon"><i class="fa fa-envelope"></i></span>
                                    <input name="ctl00$ContentPlaceHolder1$ctl01$txtEmail" type="text" id="txtEmail" class="form-control" placeholder="Email Address" />
                                </div>
                            </label>
                        </section>
                        <section>
                            <label class="input login-input no-border-top">
                                <div class="input-group">
                                    <span class="input-group-addon"><i class="fa fa-lock"></i></span>
                                    <input name="ctl00$ContentPlaceHolder1$ctl01$txtPassword" type="password" id="txtPassword" class="form-control" placeholder="Password" />
                                </div>
                            </label>
                        </section>
                        <section>
                            <label class="input login-input no-border-top">
                                <div class="input-group">
                                    <span class="input-group-addon"><i class="fa fa-lock"></i></span>
                                    <input name="ctl00$ContentPlaceHolder1$ctl01$txtPasswordAgain" type="password" id="txtPasswordAgain" class="form-control" placeholder="Password Confirm" />
                                </div>
        </label>
        </section>



<script src="<%= ResolveUrl("~/Content/assets/plugins/sky-forms-pro/skyforms/js/jquery.form.min.js")%>"></script>
<script src="<%= ResolveUrl("~/Content/assets/plugins/sky-forms-pro/skyforms/js/jquery.validate.min.js")%>"></script>

<script>
    jQuery(document).ready(function() {
        $("#form1").validate({
            // Rules for form validation
            rules:
            {
                ctl00$ContentPlaceHolder1$ctl01$txtUserName:
                {
                    required: true
                },
                ctl00$ContentPlaceHolder1$ctl01$txtEmail:
                {
                    required: true,
                    email: true
                },
                ctl00$ContentPlaceHolder1$ctl01$txtPassword:
                {
                    required: true,
                    minlength: 6,
                    maxlength: 20
                },
                ctl00$ContentPlaceHolder1$ctl01$txtPasswordAgain:
                {
                    required:true,
                    minlength:6,
                    equalTo:"#ctl00$ContentPlaceHolder1$ctl01$txtPassword"
                }

            },

            // Messages for form validation
            messages:
            {
                ctl00$ContentPlaceHolder1$ctl01$txtUserName:
                {
                    required: '* Requires a valid UserName.'

                },
                ctl00$ContentPlaceHolder1$ctl01$txtEmail:
                {
                    required: '* This is a Required Field.',
                    minlength:  '* Password Min Length of 6 char.'
                },
                ctl00$ContentPlaceHolder1$ctl01$txtPassword:
                {
                    required: '* This is a Required Field.',
                    minlength: '* Password Min Length of 6 char.'
                },
                ctl00$ContentPlaceHolder1$ctl01$txtPasswordAgain:
                {
                    required: '* This is a Required Field.',
                    minlength: '* Password Min Length of 6 char.',
                    equalTo: "Please specify the same password as above."
                }

            },

            // Do not change code below
            errorPlacement: function (error, element) {
                error.insertAfter(element.parent());
            }
        });
    });
</script>

【问题讨论】：

请仅显示 rendered HTML 标记以解决客户端问题。根据您所展示的内容，我无法判断您是否有 name 属性。这个插件需要一个name 属性，而这个name 是你唯一可以在.validate() 方法中使用的东西。
另外，您的密码和再次密码字段怎么会有两个不同的minlength 规则？无论如何，一旦您使 equalTo 规则生效，您将不需要在“再次”字段上使用任何其他规则，因为无论如何它都必须与原始规则匹配。
仅供参考 - 如果您使用 unobtrusive-validation 插件作为 ASP 框架的一部分，那么您的 .validate() 方法将被忽略，因为 Unobtrusive 插件已经调用 .validate()。它是 ASP 和 AFAIK，不引人注目是默认设置的一部分，您从未提及。

标签： javascript jquery asp.net jquery-validate

【解决方案1】：

 ctl00$ContentPlaceHolder1$ctl01$txtPasswordAgain:
   { required:true,
     equalTo:"#ctl00$ContentPlaceHolder1$ctl01$txtPassword"
   }

从 ctl00$ContentPlaceHolder1$ctl01$txtPasswordAgain 中删除 minlength

我希望它可能有效

【讨论】：

不幸的是，它产生了完全相同的结果。