$.validator. unobtrusitive .adapters. addbool()不起作用



在asp.net核心Razor Pages应用程序中,使用jquery不显眼的验证,我试图获得一个自定义验证属性以在客户端工作。表单正在呈现一个fetch()调用到一个引导模式弹出窗口,这可能与问题有关,虽然我有完全相同的问题在一个框架4.8 asp.net mvc应用程序中,表单是通过ajax调用呈现的。

在Razor Pages应用程序中,我以通常的方式设置了服务器端属性:

public class TerminationReasonCodeAttribute : ValidationAttribute, IClientModelValidator
{
private const string errorMessage = "When a Termination Reason is selected, a Termination Date must be entered, and vice-versa.";
public void AddValidation(ClientModelValidationContext context)
{
MergeAttribute(context.Attributes, "data-val", "true");
MergeAttribute(context.Attributes, "data-val-terminationreasoncode", errorMessage);
}
private bool MergeAttribute(
IDictionary<string, string> attributes,
string key,
string value)
{
if (attributes.ContainsKey(key))
{
return false;
}
attributes.Add(key, value);
return true;
}
...rest of code omitted for brevity. 

该属性被添加到以通常方式呈现在表单中的类的属性中:

[TerminationReasonCode]
[StringLength(50)]
[Display(Name = "Termination Reason")]
public string TerminationReasonCode { get; set; } 

所讨论的表单是通过对服务器端方法的fetch()调用和设置div的innerHTML来呈现的,如下所示:

div.querySelector('div.modal-body').innerHTML = cleanHtml;

由于我渲染表单异步,我必须重新解析它:

let $form = $(div).find('#editUserForm');
$form.removeData('validator').removeData('unobtrusiveValidation');
$.validator.unobtrusive.parse($form); 
然后我调用addMethod:
$.validator.addMethod("terminationreasoncode", 
function (value, element, param) {
//the attribute is applied to TerminationReasonCode. this is arbitrary
//it could have been applied to TerminationDate
let terminationReason = value;
let terminationDate = document.getElementById('TerminationDate').value;
if (terminationReason && !terminationDate) {
return false;
}
else if (terminationDate && !terminationReason) {
return false;
}
else {
return true;
}
});

最后,我称之为:

$.validator.unobtrusive.adapters.addBool("terminationreasoncode");
在我的表单中,当用户点击"保存"按钮,调用$("#editUserForm").valid()。我的自定义验证方法从未触发,我不知道为什么。当我查看渲染的内容时,我可以看到我所有的"数据……"标签正确呈现:
<select name="TerminationReasonCode" id="TerminationReasonCode" 
data-val-terminationreasoncode="When a Termination Reason is selected, a Termination Date must be 
entered, and vice-versa." 
data-val-length-max="50" 
data-val-length="The field Termination Reason must be a string with a maximum length of 50." 
data-val="true" 
class="form-control">

这里是关键:如果我不调用$.validator. unobtrusitive .adapters. addbool ("terminationreasoncode"),而是执行您在下面看到的代码,它可以工作!当我在javascript中调用$("#editUserForm").valid()时,我的验证方法被调用。为什么下面的代码工作,但调用addBool不做什么?再次,我在asp.net mvc框架4.8应用程序中有完全相同的问题,其中表单是由ajax调用呈现的,并且相同的解决方案在那里工作。

$('#TerminationReasonCode').rules('add',
{
terminationreasoncode: true,
messages: { terminationreasoncode: "When a Termination Reason is selected, a Termination Date must be entered, and vice-versa." }
});

答案是这个调用:

$.validator.unobtrusive.parse($form);

必须出现在之后这叫:

$.validator.unobtrusive.adapters.addBool("terminationreasoncode");

除了调用addBool()之外,其他一切都可以工作,即使在parse()之后运行。addBool()的调用必须在之前执行到parse()的调用。如果有人知道为什么是这种情况,请张贴答案,我会选择它。

最新更新