0

总 jQuery n00b。我有以下（简化的）表单，其中包含两个类别/组复选框（省略所有其他输入）：

<form id="myForm" method="post">
    Category 1:
    <input type="checkbox" name="check1" id="check1" value="1" />
    <input type="checkbox" name="check2" id="check2" value="2" />
    ...
    Category 2:
    <input type="checkbox" name="check3" id="check3" value="3" />
    <input type="checkbox" name="check4" id="check4" value="4" />
    <input type="submit" />
</form>

如果在提交后未选中类别 1 中的复选框或未选中类别 2 中的复选框，我将尝试引发客户端验证错误。

同样，作为一个 jQuery n00b，我已经看到了一些将错误抛出到弹出框的示例。<div>但是，我想要的是在使用 jquery.unobtrusive.validation 设置的验证错误中引发错误（不记得确切的名称）。此外，名称都是不同的，这使我无法使用一些更简单的示例。

在我的模型中，复选框实际上是布尔值（在这种情况下不能使用复选框列表），使用 ASP.net MVC。因此，在我看来，我实际上会拥有代码：@Html.Checkbox(m => m.Model.Check1)等等。.cshtml我不认为这是相关的。但我可能是错的。

4

2 回答 2

1

最简单的方法：

if ($('#check1,#check2').filter(':checked').length <= 0 || 
         $('#check3,#check4').filter(':checked').length <= 0) {
   // error message
}

您必须自己解决其余的问题，因为您没有发布有关您如何验证此表单的有用详细信息。

于 2013-02-22T19:05:27.617 回答
1

一种方法是将一个类分配给第一组复选框，例如category1，将另一个类分配给第二组，例如category2。然后你会做类似的事情

$("#myForm").submit(function() {
    if ($(".category1:checked").length == 0 || $(".category2:checked").length == 0) {
        $("#errormessage").append("<p>You must check at least one checkbox in each category!</p>"); // Or however you want the validation error to be displayed
        return false;
    }
});

但重复性较低的是div在每个组中的复选框周围放置一个或其他容器元素，然后为每个 div 赋予其自己的类或 ID（因此您有一个.category1div 包含类别 1 中的所有复选框，一个.category2div 包含所有复选框在第 2 类）。然后你会使用 $(".category1 :checked") 和 $(".category2 :checked") 作为选择器。

于 2013-02-22T19:15:37.717 回答