我有一个ASP.NET Core,Angular(2)网格和弹出窗口,我正在尝试对多个字段实施自定义验证。
如果我尝试实现如下所示的两个版本的自定义验证,则第二个验证要等到第一个通过时才能运行,这样很好,但是第二个验证消息不会出现在弹出窗口中。
schema: {
model: {
id: "contactID",
fields: {
contactID: { type: "number" },
lastName: { type: "string" },
firstName: { type: "string" },
name: { type: "string" },
jobTitle: { type: "string" },
jobTitleID: {
type: "number",
validation: {
jobTitleIdValidation: function (input, params) {
if (input.is("[name='jobTitleID']")) {
var $jobTitleId = kendo.jQuery('#jobTitleID');
var jobTitleIdValue = $jobTitleId.data("kendoComboBox").value();
if (parseInt(jobTitleIdValue, 10) === 0 || !jobTitleIdValue) {
$jobTitleId.attr('data-jobTitleIdValidation-msg', 'Job title is required');
return false;
} else {
return true;
}
}
}
}
},
office: {
type: "string"
},
officeID: {
type: "number",
validation: {
officeIdValidation: function (input, params) {
if (input.is("[name='officeID']")) {
var $officeId = kendo.jQuery('#officeID');
var officeIdValue = $officeId.data("kendoComboBox").value();
if (parseInt(officeIdValue, 10) === 0 || !officeIdValue) {
$officeId.attr('data-officeIdValidation-msg', 'Office is required');
return false;
} else {
return true;
}
} else {
return true; // for any other input
}
}
}
},
模板代码片段:
editable: {
mode: "popup",
template:
`<div id="details" _ngcontent-c2>
<div><label for="firstName">First Name</label>
<input id="firstName" data-bind="value: firstName" /></div>
<div><label for="lastName">Last Name</label>
<input id="lastName" data-bind="value: lastName" /></div>
<div><label for="email">Email</label>
<input id="email" data-bind="value: email" /></div>
<div><label for="phone">Phone</label>
<input id="phone" data-bind="value: phone" /></div>
<div><label for="mobile">Mobile</label>
<input id="mobile" data-bind="value: mobile" /></div>
<div><label for="jobTitleID">Job Title</label>
<input id="jobTitleID" name="jobTitleID" data-bind="value: jobTitleID" /></div>
<div class="validator-msg"><span data-for="jobTitleID" class="k-invalid-msg"></span></div>
<div><label for="officeID">Office</label>
<input id="officeID" name="officeID" data-bind="value: officeID" /></div>
<div class="validator-msg"><span data-for="officeID" class="k-invalid-msg"></span></div>
</div>
但是,如果我尝试在一个自定义验证规则中进行所有验证(这似乎是预期的),并且使用一个验证消息跨度(在jobTitleId下),则在提供jobTitleID之后,它不会显示有关officeID的消息。代码在这里:
jobTitleID: {
type: "number",
validation: {
customValidation: function (input, params) {
var $jobTitleId = kendo.jQuery('#jobTitleID');
if (input.is("[name='jobTitleID']")) {
var jobTitleIdValue = $jobTitleId.data("kendoComboBox").value();
if (parseInt(jobTitleIdValue, 10) === 0 || !jobTitleIdValue) {
$jobTitleId.attr('data-customValidation-msg', 'Job title is required');
return false;
} else {
return true;
}
} else if (input.is("[name='officeID']")) {
var officeIdValue = kendo.jQuery('#officeID').data("kendoComboBox").value();
if (parseInt(officeIdValue, 10) === 0 || !officeIdValue) {
$jobTitleId.attr('data-customValidation-msg', 'Office is required');
return false;
} else {
return true;
}
} else {
return true; // for any other input
}
}
}
如何使它正常运行?我怀疑这与return true
到底有关系(?)
请注意,我不想只使用required: true attribute
,因为正在显示默认的0值,我还需要验证字段的组合。