Fluent Validation,MVC:在单击按钮时触发客户端规则集验证
Fluent Validation, MVC: Triggering Client-Side RuleSet Validation on Button Click
上下文
在一个视图中,我为我的视图模型创建了 一个 表单。我使用 Twitter Bootstrap 向导插件将表单分成多个部分。用户可以通过单击 "Next" 按钮访问下一部分。每个部分都有一个为该部分的模型属性定义的 Fluent Validation RuleSet。我在每个 RuleSet 中定义的规则与 Fluent Validaiton 的客户端验证兼容。
问题
点击下一步按钮后,最好的方法是什么:
- 要使用 Fluent Validation 在 客户端 上获取 仅 当前部分的规则集的验证状态?
- 要让 Fluent Validation 仅显示当前部分规则集的客户端验证?
我尝试过的
我已阅读 Fluent Validation start guide and this question。虽然他们演示了如何在服务器端实现我正在寻找的东西,但他们似乎 无法解决我的客户端问题。我加粗 "seem" 因为我对 Fluent Validation 和 MVC 相当陌生,所以,我可能误解了链接的内容。
您可以使用 Fluent Validation 使用的 jQuery 验证库中的命令。
在表单的一个元素中,定义一个有助于识别验证组的属性。例如
@Html.EditorFor(model => model.GroupA_TextA, new { htmlAttributes = new { @class = "form-control", data_validation_group = "GroupA" }})
使用 jQuery 验证库中的 .settings.ignore
语法来控制要验证的组。
我制作了一个 class,它公开了验证 Fluent Validation 验证表单中的组以及整个表单的功能。我在下面包含了 TypeScript 和转译 JavaScript。
TypeScript
/**
* For validating a form when Fluent Validation is used for model valdiation.
*/
interface IFluentValidationFormValidator {
/**
* The form to validate.
*/
form: JQuery<HTMLElement>;
/**
* The name of the validation group to validate.
*/
group: string;
/**
* Validate the entire form.
*/
validate(): boolean;
/**
* Validate a validation group in the form.
* @param group The name of the validation group to validate.
*/
validateGroup(): boolean;
}
/**
*
*/
class StandardFluentValidationFormValidator implements IFluentValidationFormValidator {
/**
* @inheritdoc
*/
form: JQuery<HTMLElement>;
/**
* @inheritdoc
*/
group: string;
/**
* @inheritdoc
*/
validate(): boolean {
const formValidator = this.form.validate();
formValidator.form();
return formValidator.valid();
}
/**
* @inheritdoc
*/
validateGroup(): boolean {
// The form validator.
const formValidator = this.form.validate();
// Perform standard validation on form if the validation group is undefined.
if (this.group === undefined) {
formValidator.form();
return formValidator.valid();
}
// Current group validation settings.
const initialValidateIgnoreSetting = formValidator.settings.ignore;
// Ignore all elements but the group.
formValidator.settings.ignore += `,:not([data-validation-group=${this.group}])`;
// Valdiate the form.
formValidator.form();
// Reset group validation settings.
formValidator.settings.ignore = initialValidateIgnoreSetting;
// Return the validation state.
return formValidator.valid();
}
}
JavaScript
"use strict";
var StandardFluentValidationFormValidator = (function () {
function StandardFluentValidationFormValidator() {
}
StandardFluentValidationFormValidator.prototype.validate = function () {
var formValidator = this.form.validate();
formValidator.form();
return formValidator.valid();
};
StandardFluentValidationFormValidator.prototype.validateGroup = function () {
var formValidator = this.form.validate();
if (this.group === undefined) {
formValidator.form();
return formValidator.valid();
}
var initialValidateIgnoreSetting = formValidator.settings.ignore;
formValidator.settings.ignore += ",:not([data-validation-group=" + this.group + "])";
formValidator.form();
formValidator.settings.ignore = initialValidateIgnoreSetting;
return formValidator.valid();
};
return StandardFluentValidationFormValidator;
}());
上下文
在一个视图中,我为我的视图模型创建了 一个 表单。我使用 Twitter Bootstrap 向导插件将表单分成多个部分。用户可以通过单击 "Next" 按钮访问下一部分。每个部分都有一个为该部分的模型属性定义的 Fluent Validation RuleSet。我在每个 RuleSet 中定义的规则与 Fluent Validaiton 的客户端验证兼容。
问题
点击下一步按钮后,最好的方法是什么:
- 要使用 Fluent Validation 在 客户端 上获取 仅 当前部分的规则集的验证状态?
- 要让 Fluent Validation 仅显示当前部分规则集的客户端验证?
我尝试过的
我已阅读 Fluent Validation start guide and this question。虽然他们演示了如何在服务器端实现我正在寻找的东西,但他们似乎 无法解决我的客户端问题。我加粗 "seem" 因为我对 Fluent Validation 和 MVC 相当陌生,所以,我可能误解了链接的内容。
您可以使用 Fluent Validation 使用的 jQuery 验证库中的命令。
在表单的一个元素中,定义一个有助于识别验证组的属性。例如
@Html.EditorFor(model => model.GroupA_TextA, new { htmlAttributes = new { @class = "form-control", data_validation_group = "GroupA" }})
使用 jQuery 验证库中的 .settings.ignore
语法来控制要验证的组。
我制作了一个 class,它公开了验证 Fluent Validation 验证表单中的组以及整个表单的功能。我在下面包含了 TypeScript 和转译 JavaScript。
TypeScript
/**
* For validating a form when Fluent Validation is used for model valdiation.
*/
interface IFluentValidationFormValidator {
/**
* The form to validate.
*/
form: JQuery<HTMLElement>;
/**
* The name of the validation group to validate.
*/
group: string;
/**
* Validate the entire form.
*/
validate(): boolean;
/**
* Validate a validation group in the form.
* @param group The name of the validation group to validate.
*/
validateGroup(): boolean;
}
/**
*
*/
class StandardFluentValidationFormValidator implements IFluentValidationFormValidator {
/**
* @inheritdoc
*/
form: JQuery<HTMLElement>;
/**
* @inheritdoc
*/
group: string;
/**
* @inheritdoc
*/
validate(): boolean {
const formValidator = this.form.validate();
formValidator.form();
return formValidator.valid();
}
/**
* @inheritdoc
*/
validateGroup(): boolean {
// The form validator.
const formValidator = this.form.validate();
// Perform standard validation on form if the validation group is undefined.
if (this.group === undefined) {
formValidator.form();
return formValidator.valid();
}
// Current group validation settings.
const initialValidateIgnoreSetting = formValidator.settings.ignore;
// Ignore all elements but the group.
formValidator.settings.ignore += `,:not([data-validation-group=${this.group}])`;
// Valdiate the form.
formValidator.form();
// Reset group validation settings.
formValidator.settings.ignore = initialValidateIgnoreSetting;
// Return the validation state.
return formValidator.valid();
}
}
JavaScript
"use strict";
var StandardFluentValidationFormValidator = (function () {
function StandardFluentValidationFormValidator() {
}
StandardFluentValidationFormValidator.prototype.validate = function () {
var formValidator = this.form.validate();
formValidator.form();
return formValidator.valid();
};
StandardFluentValidationFormValidator.prototype.validateGroup = function () {
var formValidator = this.form.validate();
if (this.group === undefined) {
formValidator.form();
return formValidator.valid();
}
var initialValidateIgnoreSetting = formValidator.settings.ignore;
formValidator.settings.ignore += ",:not([data-validation-group=" + this.group + "])";
formValidator.form();
formValidator.settings.ignore = initialValidateIgnoreSetting;
return formValidator.valid();
};
return StandardFluentValidationFormValidator;
}());