在jquery中实现require_from_group验证 [英] implementing require_from_group in jquery validate

查看:79
本文介绍了在jquery中实现require_from_group验证的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试获取一组输入作为一个输入进行验证.因此,如果任何输入为空,它将在输入下方显示一条消息.我一直在此处关注另一个SO答案. 4个输入将无效.当没有提交数据时,他们只是不做任何事情.我的其他输入可以很好地验证. 这是我的表格:

I am trying to get get a group of inputs to validate as one. So if any of the inputs is empty, it will show a message below the inputs. I have been following another SO answer here. The 4 inputs will not validate. They just don't do anything when there is no data on submit. My other inputs validate just fine. Here is my form:

<div class="creditcard form-group">
    <h2>Credit Card</h2>
    @Html.TextBoxFor(model => model.cardNumber, new { @class = "form-control cc", @id = "CardNum", @placeholder = "Card Number" })
    @Html.TextBoxFor(model => model.name, new { @class = "form-control cap cc", @id = "FullName", @placeholder = "Full Name" })
    @Html.TextBoxFor(model => model.expDate, new { @class = "form-control cc", @id = "CardExp", @placeholder = "MM/YY" })
    @Html.TextBoxFor(model => model.cvv, new { @class = "form-control cc", @id = "CardCVV", @placeholder = "CVV" })
    @Html.HiddenFor(model => model.ccType)
    ....

正在验证的我的jquery:

And my jquery that is validating:

$.validator.addMethod("require_from_group", function (value, element, options) {
    var valid = $(options[1], element.form).filter(function () {
        return $(this).val();
    }).length >= options[0];
    return valid;
    }, $.validator.format("Please fill out at least {0} of these fields."));
    $("form").validate({
        rules: {
            cardNumber: { require_from_group: [2, ".cc"] },
            name: { require_from_group: [2, ".cc"] },
            expDate: { require_from_group: [2, ".cc"] },
            cvv: { require_from_group: [2, ".cc"] }
        }
    });

如果有帮助,这是MVC 5.

This is MVC 5 if that helps.

推荐答案

您正尝试遵循5年的答案.从那时起,默认的require_from_group方法的错误已得到修复.而且该功能目前比您手动创建的功能复杂得多.

You're trying to follow an answer that is five years old. Since that time, the default require_from_group method's bugs have been fixed; and the function is presently much more complex than the function you're manually creating.

因此,您只需要包含 additional-methods.js文件以使用默认的require_from_group方法.否则,您可以从additional-methods.js文件中复制此方法,但是IMO最好包括该文件,以备将来维护.

So you only need to include the additional-methods.js file to use the default require_from_group method. Otherwise, you could copy this method out of the additional-methods.js file, but IMO, it's better to include the file for future maintainability.

如果仍不能解决问题,则需要向我们展示您的 渲染的 HTML标记(如浏览器源中所示),以检查您是否已经还有其他错误.

If that doesn't fix it, you'll need to show us your rendered HTML markup, as seen in the browser source, to check if you've made any other mistakes.

工作示例: http://jsfiddle.net/jo65e26a/

Working DEMO: http://jsfiddle.net/jo65e26a/

我正在尝试获取一组输入作为一个输入进行验证.

I am trying to get get a group of inputs to validate as one.

这不是require_from_group的目的,也不是您的配置方式...

That is not what require_from_group is meant to do, nor is that how you've configured it...

require_from_group: [2, ".cc"]

2参数意味着将需要四个输入中的任意两个输入.如果您需要填写所有四个,则可以将参数设置为4,但这与在所有四个输入上简单地使用required规则完全没有区别.

The 2 parameter means that any two inputs out of your group of four will be required. If you need all four to be filled out then you would set the parameter to 4, but then it's absolutely no different than simply using required rule on all four inputs.

文档: require_from_group

也许您打算将验证消息分组为一个?如果是这样,则可以使用 groups选项.

Perhaps you meant to group the validation messages together into one? If so, then you'd use the groups option.

groups: {
    ccGroup: "cardNumber name expDate cvv"
}

演示2: http://jsfiddle.net/sx7cda0c/1/

DEMO 2: http://jsfiddle.net/sx7cda0c/1/

还有一种称为skip_or_fill_minimum的方法,这意味着您可以在需要的组中设置最小数量的字段,否则可以跳过该组.不确定这是否也是您想要的.

There is also a method called skip_or_fill_minimum which means that you set a minimum number of fields out of a group to be required, otherwise, the group can be skipped. Not sure if that's what you want either.

这篇关于在jquery中实现require_from_group验证的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆