javascript - MVC3 Razor - 至少一个复选框检查了验证

Question

我是 mvc3 和 razor 引擎的新手，我希望它至少选中一个复选框以触发提交按钮。

 <div class="editor-field">
      @Html.Label("item1")
      @Html.CheckBoxFor(Model => Model.item1)
      @Html.Label("item2")
      @Html.CheckBoxFor(Model => Model.item2)
      @Html.Label("item3")
      @Html.CheckBoxFor(Model => Model.item3)
 </div>
 <p>
     <input type="submit" value="Create" />
 </p>

我知道如果选择了 0 个复选框，我需要某种标签来呈现文本，并且每个复选框都需要一个 id，以便我可以查看它们的值，但是 mvc3 razor 中有什么东西可以让这更简单吗？谢谢

Answer 1

许多方法之一是

<input type="submit" value="Create" onclick="return submitWith();"/>
<span id="validationMessage" />

并在您的 javascript 中（您可能在这里有更多但保持简单）

function submitWith(){   
    var checkedCount = $("input:checked").length;
    var valid = checkedCount > 0;
    if(!valid){
         $('#validationMessage').html('You must select at least one option');
    }
    return valid ;        
}

Answer 2

为复选框提供一些有效的名称属性。每个复选框的名称应该相同。让我们说： Name="CheckBoxForItems"

创建按钮的按钮Click事件：(In js)
声明数组并使用每个函数检查是否选中了任何复选框：

var arr = new Array();
$('input[name="CheckBoxForItems"]:checked').each(function (i) {
                arr.push($(this).attr("id"));
            });

 if(arr.length > 0)
$("#ButtonId").submit();
}