MVC中CheckBox

浏览数：37 / 时间：2015年06月09日

一、单个Checkbox

1、View文件

<%= Html.CheckBoxFor(model => model.IsNeverExpired)%>

2、生成的HTML为

3、备注

（1）、上面生成的HTML有点奇怪, 为什么它会生成两个控件呢?

因为如果只生成一个input, 系统无法区分"没有选中checkbox" 和 "checkbox没有生成".

（2）、那又是为什么只生成一个input就无法区分呢?

原来当一个form中包含checkbox时,如果没有给它赋值(选中), 在服务器端Request.Form中得到的值是NULL

二、多个Checkbox

方法一：通过在视图页编码的方式

C# 代码复制


@using MvcCheckBoxList.Model
@model MvcApplication2.Models.UserVm

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout。cshtml";
}

@using (Html.BeginForm())
{
    @Html.HiddenFor(m => m.User.Id)

    <br/>
    @Html.LabelFor(m => m.User.Name)
    @Html.EditorFor(m => m.User.Name)
    @Html.ValidationMessageFor(m => m.User.Name)
    <br/>
    <ul style="list-style:none;">

        @foreach (var a in Model.AllRoles)
        {
            <li>
                @if (Model.SelectedRoleIds.Contains(a.Id))
                {
                    <input type="checkbox" name="SelectedRoleIds" value="@a.Id" id="@a.Id" checked="checked"/>
                    <label for="@a.Id">@a.Name</label>
                }
                else
                {
                    <input type="checkbox" name="SelectedRoleIds" value="@a.Id" id="@a.Id" />
                    <label for="@a.Id">@a.Name</label>
                }
            </li>
        }
    </ul>
    <br/>
    <input type="submit" value="为用户设置角色"/>
}

@section scripts
{
    @Scripts.Render("~/bundles/jqueryval")
}

方法二：通过NuGet的MvcCheckBoxList扩展

→工具--库程序包管理器--程序包管理器控制台→install-package MvcCheckBoxList

C# 代码复制


@using MvcCheckBoxList.Model
@model MvcApplication2.Models.UserVm

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout。cshtml";
}

@using (Html.BeginForm())
{
    @Html.HiddenFor(m => m.User.Id)

    <br/>
    @Html.LabelFor(m => m.User.Name)
    @Html.EditorFor(m => m.User.Name)
    @Html.ValidationMessageFor(m => m.User.Name)
    <br/>
    @Html.CheckBoxListFor(m => m.SelectedRoleIds,
                            m => m.AllRoles, //所有角色
                            r => r.Id, //value值
                            r => r.Name, //显示值
                            r => r.UserRoles, //用户当前角色
                            Position.Horizontal //CheckboxList排列方向
                          )
    <br/>
    <input type="submit" value="为用户设置角色"/>
}

@section scripts
{
    @Scripts.Render("~/bundles/jqueryval")
}