在验证函数中验证字段

Question

这与这个问题有关：Validation for selecting a minimum and maximum

所以我有两个字段，一个用于最小值，一个用于用户必须输入的最大值。我需要在两个字段上验证它们是否正确 minim < maxim.

我有以下代码

$.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 不正确，输入验证错误 class 未被删除。

如何触发验证函数中其他字段的验证？

更新我应该提到我需要修复的情况是当我更改其中一个字段（keyup 或 lostfocus）时执行验证。

示例：我有 min 2 和 max 5。我将最小值更改为 23，这两个字段都变得无效并且有错误 class 与之关联我将最小值更改为 3 只有最大字段才有效。即使验证函数 returns 有效，最小字段仍然无效。

Answer 1

经过进一步调查，我发现了我的问题。似乎当您在内部调用 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;
  });
});

所以基本上我正在为最小值和最大值设置一个组名。在准备好的文档中，我正在获取验证器并为表单元素设置组名。另外我设置元素是有效的，否则验证只会在元素是 "validated" 之后执行（在控件中设置焦点并失去焦点或提交）[看来该组仅使用required_from_groups 记住，因此它会验证其他字段是否有更改的值]

在验证函数中验证字段

Validate a field inside a validation function

jquery

jquery-validate

unobtrusive-validation