javascript - jQuery 验证 - 如果多次使用,skip_or_fill_minimum 规则不会触发

标签 javascript jquery jquery-validate

我有一个由四个输入组成的表单,它们成对分组。

这个表单的规则非常简单,如果我填写了一对输入中的一个,我也必须填写另一个,或者我不填写任何一个,所以为了实现这种行为,我使用了 skip_or_fill_minimun 方法。

HTML:

<div id="msgErros"></div>
<form>
    <label for="dataInicial">Data Inicial</label>
    <input type="text" name="filtro.dataInicial" id="dataInicial" class="datas" />
    <label for="dataFinal">Data Final</label>
    <input type="text" name="filtro.dataFinal" id="dataFinal" class="datas" />
    <br />
    <label for="tempoInicial">Tempo Inicial</label>
    <input type="text" name="filtro.tempoInicial" id="tempoInicial" class="tempos" />
    <label for="tempoFinal">Tempo Final</label>
    <input type="text" name="filtro.tempoFinal" id="tempoFinal" class="tempos" />
    <br />
    <button type="submit">Enviar</button>
</form>

验证规则、消息和组:

$("form").validate({
    rules : {
        "filtro.dataInicial": {
            skip_or_fill_minimum: [2, ".datas"]
        },
        "filtro.dataFinal": {
            skip_or_fill_minimum: [2, ".datas"]
        },
        "filtro.tempoInicial": {
            skip_or_fill_minimum: [2, ".tempos"]
        },
        "filtro.tempoFinal": {
            skip_or_fill_minimum: [2, ".tempos"]
        }
    },
    messages: {
        "filtro.dataInicial": {
            skip_or_fill_minimum: "Por favor, preencha ambos os campos de data ou nenhum deles."
        },
        "filtro.dataFinal": {
            skip_or_fill_minimum: "Por favor, preencha ambos os campos de data ou nenhum deles."
        },
        "filtro.tempoInicial": {
            skip_or_fill_minimum: "Por favor, preencha ambos os campos de tempo ou nenhum deles."
        },
        "filtro.tempoFinal": {
            skip_or_fill_minimum: "Por favor, preencha ambos os campos de tempo ou nenhum deles."
        }
    },
    groups : {
        grupoDatasAtendimentoSintetico : "filtro.dataInicial filtro.dataFinal",
        grupoTemposAtendimentoSintetico : "filtro.tempoInicial filtro.tempoFinal"
    },
    errorContainer : "#msgErros ul",
    errorLabelContainer : "#msgErros",
    wrapper : "li"
});

这里发生的问题是,如果我填写前两个输入之一,则规则根本不会被触发,如果我填写第二对,则不会出现问题。如果我删除第二对,规则执行得很好,所以我认为这是一个错误。这是 fiddle .

我读到了有关此方法和 require_from_group 导致的问题,这些问题只是阻止了其他方法的执行,但这个问题应该在我正在使用的版本 1.11.1 中得到纠正我的项目和fiddle对于插件本身和附加方法。

仅当用户填写第一对中的一个字段时才会出现此问题。有谁知道这是否是另一个错误?我在GitHub issue tracker中没有找到任何与此相关的内容。这个插件的。

更新:

我刚刚放置了一个 issue在插件的问题跟踪器中。

最佳答案

您报告的问题已解决 in a recent commit .

我已经updated your Fiddle 。我删除了外部依赖项,从 http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js 复制并粘贴了代码在 JavaScript 部分的开头,后面是 http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/additional-methods.js 中的代码- 最后我保持你的 JavaScript 不变。

然后,我在这里找到了最新版本的“skip_or_fill_minimum”代码:https://github.com/jzaefferer/jquery-validation/blob/master/src/additional/skip_or_fill_minimum.js

jQuery.validator.addMethod("skip_or_fill_minimum", function(value, element, options) {
    var $fields = $(options[1], element.form),
        $fieldsFirst = $fields.eq(0),
        validator = $fieldsFirst.data("valid_skip") ? $fieldsFirst.data("valid_skip") : $.extend({}, this),
        numberFilled = $fields.filter(function() {
            return validator.elementValue(this);
        }).length,
        isValid = numberFilled === 0 || numberFilled >= options[0];

    // Store the cloned validator for future validation
    $fieldsFirst.data("valid_skip", validator);

    // If element isn't being validated, run each skip_or_fill_minimum field's validation rules
    if (!$(element).data("being_validated")) {
        $fields.data("being_validated", true);
        $fields.each(function() {
            validator.element(this);
        });
        $fields.data("being_validated", false);
    }
    return isValid;
}, jQuery.validator.format("Please either skip these fields or fill at least {0} of them."));

最后,粘贴此代码来替换 Fiddle 中的先前版本。

这样一来,问题就迎刃而解了!由此我们得出结论,该错误确实存在,但已被修复。

<小时/>

更新:

版本 1.11.1 于 2013 年 3 月 22 日发布 ( https://github.com/jzaefferer/jquery-validation/tree/1.11.1 )。修复该 bug 的提交日期为 2013 年 8 月 27 日 ( https://github.com/jzaefferer/jquery-validation/commit/e5207d63a831fdfa30ea6927906288ae60336c76 )

你的代码没有任何问题。这是 jQuery Validate 中的一个错误。该错误存在于版本 1.11.1 中 - 要么您等待新版本,要么您必须自行应用修复程序。

要应用此修复,您需要将有问题的 skip_or_fill_minimum 代码替换为最新代码(粘贴在上面)。为此,请使用非最小化版本的 additional-methods.js。 (如果需要,您可以稍后使用“uglify.js”或其他工具将其最小化。)

关于javascript - jQuery 验证 - 如果多次使用,skip_or_fill_minimum 规则不会触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21614831/

相关文章:

jquery validate - 如果隐藏字段有值则有效

javascript - jQuery.validate - valid() 意外失败

javascript - 带有 {{}} 指令属性的 Angular

javascript - 从匿名函数外部访问变量

javascript - 根据角色 Angular 不同的模板 url

javascript - 检查 JSON 对象是否已定义

jquery - 使用 JQuery 验证插件获取重复的错误消息

javascript - 在 Aurelia 中,如何根据按键事件获取文本区域内光标的坐标?

javascript - 如何: Control character count p tag with contenteditable ="true"?

jquery - 在 slider 中,我想更改当前幻灯片的样式