jquery - 验证验证函数中的字段
问题描述
这与这个问题有关:Validation for selection a minimum and maximum
所以我有两个字段,一个用于最小值,一个用于用户必须输入的最大值。我需要在这两个字段上验证它们是正确的最小值 < 最大值。
我有以下代码
$.validator.addMethod('lessthan', function (value, element, params) {
var greatElement, validator, less, greatText, isEqualValid, great;
greatElement = $(params[0]);
// This code does not work
//validator = $( greatElement[0].form ).validate();
//validator.element(greatElement);
// This code does not work
greatElement.valid();
// validate the current value
// missing for brevety
});
$.validator.unobtrusive.adapters.add('lessthan', ['compareto', 'isequalvalid'], function (options) {
var element = $(options.form).find('input[name=' + options.params['compareto'] + ']')[0];
options.rules['lessthan'] = [element, options.params['isequalvalid']];
options.messages['lessthan'] = options.message;
});
但是,当我尝试验证当前字段的另一个字段时,即使 aria-invalid 不正确,输入验证错误类也不会被删除。
如何触发验证函数内其他字段的验证?
更新我应该提到我需要解决的情况是当我更改其中一个字段(keyup 或 lostfocus)时执行验证。
示例:我有 min 2 和 max 5。我将 min 更改为 23,这两个字段都变得无效并且有与之关联的错误类我将 min 更改为 3,只有 max 字段才有效。即使验证函数返回有效的 min 字段仍然无效。
解决方案
经过进一步调查,我发现了我的问题。似乎当您在内部调用 validator.element 函数时,它设置了一个属性 currentElements。所以基本上你正在改变正在验证的当前元素。
所以为了解决我的问题,我将 currentElements 设置回正在验证的元素
$.validator.addMethod('lessthan', function (value, element, params) {
var greatElement, validator, less, greatText, isEqualValid, great;
greatElement = $(params[0]);
validator = $( greatElement[0].form ).validate();
validator.element(greatElement);
// THIS IS THE LINE ADDED
validator.currentElements = $(element);
// validate the current value
// missing for brevety
});
$.validator.unobtrusive.adapters.add('lessthan', ['compareto', 'isequalvalid'], function (options) {
var element = $(options.form).find('input[name=' + options.params['compareto'] + ']')[0];
options.rules['lessthan'] = [element, options.params['isequalvalid']];
options.messages['lessthan'] = options.message;
});
您当然可以在调用 validator.element 之前获取之前的 currentElements 并在调用之后将其设置回来。
组可能有另一种选择,但似乎 html5 标签不支持组,因此实施起来可能比较棘手。
更新正确的解决方案
由于我没有使用 form.validate(settings) 并且 html5 标签不支持这些组,因此我不得不实施替代解决方案:
$(document).ready(function () {
$('[data-val-lessthan-groupname]').each(function () {
var validator = $(this.form).validate();
validator.groups[this.name] = $(this).data('val-lessthan-groupname');
validator.invalid[this.name] = true;
});
});
所以基本上我为最小值和最大值设置了一个组名。在准备好的文档中,我正在获取验证器并为表单元素设置组名。另外我设置元素是有效的,否则验证只会在元素“验证”后执行(在控件中设置焦点并失去焦点或提交)[似乎该组仅使用 required_from_groups 开发请注意,如果其他字段的值发生变化,它会验证其他字段]
推荐阅读
- android - 如何修复 ExoPlayer 错误“本机窗口无法处理受保护的缓冲区”
- javascript - 听 EACCES:权限被拒绝 0.0.0.0:8080
- python-3.x - 使用 title() 在 python 中创建一个额外的行
- c# - 如何在加载页面之前检查 Internet 连接?
- angular - 如何在剑道角网格内添加迷你图?
- sql - 数据库:相关字段包含多个值
- android - 单击时如何获取 Firestore RecyclerView 项目的文档 ID
- angular - 如何根据id取json键值
- r - 如何保存/加载通过 R 中的 h2o4gpu 库创建的随机森林模型?
- android - 如何在 Android 8.1 上访问 DCIM 文件夹