.NET MVC3使用CheckBox List（复选框列表）的简单方法

MVC3中并没有提供CheckBox List的实现，刚开始用起来感觉很不方便，最初想到的是做HTMLHelpper的一些扩展，但是那样用起来感觉不是十分方便，并且需要在C#代码里面写HTML Style等一些东西。其实，直接在View里面加一个循环就可以使用。

假如我做一个用户添加功能，用户可能属于不同的角色：

 

 我定义Model的是 AddUserModel,里面有一个属性Roles用来存放角色：

        [Display(Name = "所属角色")]
        public IEnumerable<SelectListItem> Roles { get; set; }

在Controller里面这样写：

        public ActionResult AddUser()
        {
            AddUserModel model = new AddUserModel();
            InitMenu(model, AddUserModel.ITEM_ADD_USER);

            var roles = new[]   
            {  
                new SelectListItem { Value = "1", Text="角色1", Selected = false },  
                new SelectListItem { Value = "2", Text="角色2",Selected = true },  
                new SelectListItem { Value = "3", Text="角色3",Selected = false },  
            };

            model.Roles = roles;
            return View(model);
        }

        [HttpPost]
        public ActionResult AddUser(AddUserModel model, string[] roles)
        {
            InitMenu(model, AddUserModel.ITEM_ADD_USER);
            return View(model);
        }

 

视图里面这样写：

            <div class="editor-label">
                @Html.LabelFor(m => m.Roles)
            </div>
            <div class="editor-field">
                @foreach (SelectListItem item in Model.Roles)
                {
                    var ischecked = "";
                    if (item.Selected)
                    {
                        ischecked = "checked='checked'";
                    }
                   <input name="roles" type="checkbox" value="@item.Value" @ischecked />
                   @item.Text

                }
            </div>

 

这样就可以实现一个CheckBox List了，通过修改视图代码可以自由定义样式。Controller里面接收到的数据是这个样子：

 

现在有一个问题就是每次在View里面使用CheckBox List的时候代码有点点多，可以把现实代码放在一个Template里面，比如Template的名字为CheckBoxList.cshtml：

Template 的代码：

 @model IEnumerable<SelectListItem>
            
 @foreach (SelectListItem item in Model)
 {
     var ischecked = "";
     if (item.Selected)
     {
         ischecked = "checked='checked'";
     }
    <input name="@ViewData["ListName"]" type="checkbox" value="@item.Value" @ischecked />
    @item.Text

 }

视图里面的调用代码：

            <div class="editor-field">
                @Html.DisplayFor(m => m.Roles, "CheckBoxList", new {ListName="Roles"})
            </div>

 这样用起来就比较方便了。