Question

情况就是这样：

我有 5组 3个输入字段，因此 15 输入字段总计。这是它在html中的外观：

<fieldset>
    <legend>Lower secondary studies</legend>
    <em>Last obtained degree</em>

    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.lwsdegreeTitle" placeholder="Degree title" name="lwsappdegreetitle" id="lwsappdegreetitle" type="text">
    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.lwseducationauthority" placeholder="Education authority" name="lwsappeducationauthority" id="lwsappeducationauthority" type="text">
    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.lwsgraduationyear" placeholder="Graduation year" name="lwsappgraduationyear" id="lwsappgraduationyear" type="text">

</fieldset>
<fieldset>
    <legend>Higher secondary studies</legend>
    <em>Last obtained degree</em>

    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.hssdegreeTitle" placeholder="Degree title" name="hssappdegreetitle" id="hssappdegreetitle" type="text">
    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.hsseducationauthority" placeholder="Education authority" name="hssappeducationauthority" id="hssappeducationauthority" type="text">
    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.hssgraduationyear" placeholder="Graduation year" name="hssappgraduationyear" id="hssappgraduationyear" type="text">

</fieldset>
<fieldset>
    <legend>Higher short term education</legend>
    <em>Last obtained degree</em>

    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.hstedegreeTitle" placeholder="Degree title" name="hsteappdegreetitle" id="hsteappdegreetitle" type="text">
    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.hsteeducationauthority" placeholder="Education authority" name="hsteappeducationauthority" id="hsteappeducationauthority" type="text">
    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.hstegraduationyear" placeholder="Graduation year" name="hsteappgraduationyear" id="hsteappgraduationyear" type="text">

</fieldset>
<fieldset>
    <legend>Higher long term education</legend>
    <em>Last obtained degree</em>

    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.hltedegreeTitle" placeholder="Degree title" name="hlteappdegreetitle" id="hlteappdegreetitle" type="text">
    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.hlteeducationauthority" placeholder="Education authority" name="hlteappeducationauthority" id="hlteappeducationauthority" type="text">
    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.hltegraduationyear" placeholder="Graduation year" name="hlteappgarduationyear" id="hlteappgraduationyear" type="text">

</fieldset>
<fieldset>
    <legend>Additional studies - specialty</legend>
    <em>Last obtained degree</em>

    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.assdegreeTitle" placeholder="Degree title" name="assappdegreetitle" id="assappdegreetitle" type="text">
    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.asseducationauthority" placeholder="Education authority" name="assappeducationauthority" id="assappeducationauthority" type="text">
    <input class="ng-pristine ng-untouched ng-valid" ng-model="application.assgraduationyear" placeholder="Graduation year" name="assappgarduationyear" id="assappgraduationyear" type="text">
</fieldset>

现在，我如何确保必须填写5个输入组中的一个（所有3个输入字段）？因此，您无法填写3中的一个，您必须填写（组中的）所有3个输入字段。

Answer 1

function check() {
    var check = false;
    $.each($('fieldset'), function () { //loops through all fieldsets
        if (!check) { //are there no fieldsets with  3 filled input elements then check is false so far
            check = $(this).find('input:text').filter(function () { //checks whether inputs are filled
                return this.value != "";
            }).length > 2; //If filled inputs > 2 -> check = true
        }
    });
    return check;
}

抱歉我的英文不好; - ）

Fiddle

Answer 2

一个非常粗略（快速且有点脏）的解决方案，以确保“组”中的任何一个或所有输入都被填充（为了清楚起见，只保留简化HTML的基本部分）：

<fieldset>
    <legend>...</legend>
    <em>...</em>

    <input ng-model="application.a" ng-required="application.b || application.c" />
    <input ng-model="application.b" ng-required="application.a || application.c" />
    <input ng-model="application.c" ng-required="application.b || application.a" />

</fieldset>

含义：“如果其他两个中的任何一个都有文字”，则每个都是必需的。

如果您想要更彻底，基于模型的验证，您可能需要查看我正在使用的库egkyron。

使一组输入字段需要5组

2 个答案: