应在单行中选择至少一个复选框答案

【问题标题】：Atleast one Checkbox should be Selected in Single Row应在单行中选择至少一个复选框
【发布时间】：2021-03-23 20:53:52
【问题描述】：

我希望至少选中一个复选框。我有多行，每行有多个复选框，我希望根据每行上的选择选项在每行中选择至少一个复选框。如果选择 false，则无需验证至少一个复选框被选中，但如果选择 true，则至少应满足选中一个复选框的条件。 对于第 1 行：

<select  id="demo1" name="demo1" class="form-control" style="background-color: #e7e7ed">
    <option value="false">false</option>
    <option value="true">true</option>
</select>
<div class="row">
    <div class="edit-weekDays-selector col-7 edit-weekDays-margin" id="editWeekDaysColor">
        <input type="checkbox" name="weekDays1" id="weekday-mon1" value="MON"class="weekday" />
        <label for="weekday-mon">M</label>
        <input type="checkbox" name="weekDays1" id="weekday-tue1" value="TUE"class="weekday" />
        <label for="weekday-tue">T</label>
        <input type="checkbox" name="weekDays1" id="weekday-wed1" value="WED"class="weekday" />
        <label for="weekday-wed">W</label>
        <input type="checkbox" name="weekDays1" id="weekday-thu1" value="THU" class="weekday" />
        <label for="weekday-thu">T</label>
        <input type="checkbox" name="weekDays1" id="weekday-fri1" value="FRI" class="weekday" />
        <label for="weekday-fri">F</label>
        <input type="checkbox" name="weekDays1" id="weekday-sat1" value="SAT" class="weekday" />
        <label for="weekday-sat">S</label>
        <input type="checkbox" name="weekDays1" id="weekday-sun1" value="SUN" class="weekday" />
        <label for="weekday-sun">S</label>
    </div>
</div>

对于第 2 行：

<select  id="demo2" name="demo2" class="form-control" style="background-color: #e7e7ed">
    <option value="false">false</option>
    <option value="true">true</option>
</select>
<div class="row">
    <div class="edit-weekDays-selector col-7 edit-weekDays-margin" id="editWeekDaysColor">
        <input type="checkbox" name="weekDays2" id="weekday-mon2" value="MON"class="weekday" />
        <label for="weekday-mon">M</label>
        <input type="checkbox" name="weekDays2" id="weekday-tue2" value="TUE"class="weekday" />
        <label for="weekday-tue">T</label>
        <input type="checkbox" name="weekDays2" id="weekday-wed2" value="WED"class="weekday" />
        <label for="weekday-wed">W</label>
        <input type="checkbox" name="weekDays2" id="weekday-thu2" value="THU" class="weekday" />
        <label for="weekday-thu">T</label>
        <input type="checkbox" name="weekDays2" id="weekday-fri2" value="FRI" class="weekday" />
        <label for="weekday-fri">F</label>
        <input type="checkbox" name="weekDays2" id="weekday-sat2" value="SAT" class="weekday" />
        <label for="weekday-sat">S</label>
        <input type="checkbox" name="weekDays2" id="weekday-sun2" value="SUN" class="weekday" />
        <label for="weekday-sun">S</label>
    </div>
</div>

对于所有这些行，只有一个提交按钮。对于其他行也是如此。因此可以有许多行具有不同的复选框 ID 和名称。我不知道如何使用我上面提到的计划类型的附加条件来验证选中的至少一个复选框。

【问题讨论】：

标签： javascript html jquery css ajax

【解决方案1】：

按名称选择一组复选框并循环该组以测试至少一个选中的元素。

function testForCheckedElement(checkboxGroupName){
    let oneChecked = false;
    $( "input[name="+checkboxGroupName+"]" ).each(function( index ) {
        if($(this).is(':checked')){
            oneChecked = true;
        }
    });
    return oneChecked;
}

所以你可以将name属性发送给函数并测试组：

if(tesetForCheckedElement('weekDays1'){
    console.log('at least one element is checked');
}
else{
    console.log('no elements checked in group');
}

【讨论】：