我有 3 行用户必须填写的复选框。验证是他必须在每一行中至少选择一个复选框。因此,我创建了强制规则,因为据我了解,所需规则不适用于复选框。
这一切都很好。问题是,由于每一行都是一个组,因此验证最终会给出 3 条不同的消息,尽管我真的只想要一个。
我在 jsFiddle 上创建了一个示例。因此,如果您只是单击提交,您将看到 3 条不同的消息,但我只想要一条消息。有没有办法将它们结合起来?我已经看到它通过常规的 jQuery 验证完成,但不是通过不显眼的验证。
我也在此处发布了相关代码,但如果您关注 jsFiddle 链接,可能更容易查看。
<script type="text/javascript">
(function ($) {
$.validator.unobtrusive.adapters.addBool("mandatory", "required");
} (jQuery));
</script>
<form id="the_form" action="#" method="post">
<p>
<input type="checkbox" name="g1" data-val="true" data-val-mandatory="An answer is required for every row" value="1"/><span>A1</span>
<input type="checkbox" name="g1" data-val="true" data-val-mandatory="An answer is required for every row" value="1" /><span>A2</span>
<input type="checkbox" name="g1" data-val="true" data-val-mandatory="An answer is required for every row" value="1" /><span>A3</span>
</p>
<p>
<input type="checkbox" name="g2" data-val="true" data-val-mandatory="An answer is required for every row" value="1" /><span>B1</span>
<input type="checkbox" name="g2" data-val="true" data-val-mandatory="An answer is required for every row" value="1" /><span>B2</span>
<input type="checkbox" name="g2" data-val="true" data-val-mandatory="An answer is required for every row" value="1" /><span>B3</span>
</p>
<p>
<input type="checkbox" name="g3" data-val="true" data-val-mandatory="An answer is required for every row" value="1" /><span>C1</span>
<input type="checkbox" name="g3" data-val="true" data-val-mandatory="An answer is required for every row" value="1"/><span>C2</span>
<input type="checkbox" name="g3" data-val="true" data-val-mandatory="An answer is required for every row" value="1"/><span>C3</span>
</p>
<p class="field-validation-error" data-valmsg-for="g1" data-valmsg-replace="true"></p>
<p class="field-validation-error" data-valmsg-for="g2" data-valmsg-replace="true"></p>
<p class="field-validation-error" data-valmsg-for="g3" data-valmsg-replace="true"></p>
<input type="submit" value="Ok" />
</form>