jQuery验证等于在内容页面中不起作用 ASP.net

Question

我有两个文本框，用于密码和确认密码。但是使用 Jquery 验证插件的验证不起作用。我的控件位于"内容"页面中。

<asp:textbox TextMode="Password" runat="server" ID="txtPassword" required="True"  class="form-control"></asp:textbox>

<asp:textbox TextMode="Password" runat="server" ID="txtConfPassword" required="True" equalto= "ContentPlaceHolder1_txtPassword"  class="form-control"></asp:textbox>

我什至尝试过

equalto='<%=txtPassword.UniqueID %>' and equalto='<%=txtPassword.ClientID %>'

但它不起作用。我的脚本位于母版页中，如下所示

function setFormValidation(id) {
$(id).validate({
highlight: function (element) {
$(element).closest('.form-group').removeClass('has-success').addClass('has-danger');
$(element).closest('.form-check').removeClass('has-success').addClass('has-danger');
},
success: function (element) {
$(element).closest('.form-group').removeClass('has-danger').addClass('has-success');
$(element).closest('.form-check').removeClass('has-danger').addClass('has-success');
},
errorPlacement: function (error, element) {
$(element).closest('.form-group').append(error);
},
});
} 
$(document).ready(function() {
setFormValidation('#form1');
});

所有其他验证工作正常。我知道当内容页面中文本框的 id 更改时会发生错误。

请帮忙。

编辑 1

我已经尝试通过在母版页中添加以下脚本。

$(id).validate({
rules: {
'<%= this.ContentPlaceHolder1.FindControl("txtPassword").UniqueID %>': {
required: true,
rangelength: [6, 15]
},
'<%= this.ContentPlaceHolder1.FindControl("txtConfPassword").UniqueID %>': {
required: true,
equalTo: '#<%= this.ContentPlaceHolder1.FindControl("txtPassword").ClientID %>'
}
},
messages: {
'<%= this.ContentPlaceHolder1.FindControl("txtPassword").UniqueID %>': {
required: "This field is required.",
rangelength: "Minimum 6 characters required"
},
'<%= this.ContentPlaceHolder1.FindControl("txtConfPassword").UniqueID %>': {
equalTo: "Please enter the same password again"
}
},
highlight: function (element) {
$(element).closest('.form-group').removeClass('has-success').addClass('has-danger');
$(element).closest('.form-check').removeClass('has-success').addClass('has-danger');
},
success: function (element) {
$(element).closest('.form-group').removeClass('has-danger').addClass('has-success');
$(element).closest('.form-check').removeClass('has-danger').addClass('has-success');
},
errorPlacement: function (error, element) {
$(element).closest('.form-group').append(error);
},
})

它适用于特定页面(例如用户.aspx(。 但是当我导航到任何其他页面时，它会抛出错误 对象引用未设置为对象的实例。 在'<%= this.ContentPlaceHolder1.FindControl("txtPassword").UniqueID %>':因为该控件不会存在于内容页面中

我试图将母版页中的 if else 条件设置为

if (window.location.pathname == "/admin/AddUser.aspx") {

它仍然抛出错误

Answer 1

try equalTo=">#txtPassword">

<asp:TextBox TextMode="Password" runat="server" ID="txtPassword" required="True"  class="form-control"></asp:TextBox>
<asp:TextBox TextMode="Password" runat="server" ID="txtConfPassword" required="True" equalTo="#txtPassword" class="form-control"></asp:TextBox>

或者使用验证规则

标记

<asp:TextBox TextMode="Password" runat="server" ID="txtPassword" class="form-control"></asp:TextBox>
<asp:TextBox TextMode="Password" runat="server" ID="txtConfPassword" class="form-control"></asp:TextBox>

JavaScript

<script>
function setFormValidation(id) {
$(id).validate({
rules: {
txtPassword: {
required: true
},
txtConfPassword: {
required: true,
equalTo: '#txtPassword' // '#<%= txtPassword.ClientID %>' // this would work too
}
}
});
}
$(document).ready(function () {
setFormValidation('#form1');
});
</script>

有关验证的更多信息，请查看jQuery验证插件

更新

我刚刚意识到母版/内容页面略有不同，您的代码是正确的，在 EqualTo 中定义的 id 前面加上一个井号：

<asp:TextBox TextMode="Password" runat="server" ID="txtConfPassword" required="True" equalto="#ContentPlaceHolder1_txtPassword" class="form-control">