生成动态复选框,并选择其中一些作为已选中

时间:2012-05-09 13:42:23

标签: c# asp.net-mvc c#-4.0 razor checkbox

所以我的问题就是这样,

我有两个列表

LIST A包含。

  1. 第1项
  2. 第2项
  3. 第3项
  4. 第4项
  5. 第5项
  6. 列表B包含

    1. 第1项
    2. 第2项
    3. 第3项
    4. 第4项
    5. .....
    6. ....
    7. 第10项
    8. 我想要做的就是在MVC Razor View中为B中的所有项动态生成复选框,在这些复选框中,选中(选择)A中所有项目的所有复选框。 因为A将永远是B的子集。

      然后用户可以选中 - 取消选中任何框,这些值可以传递给控制器​​以进行保存。列表A将使用用户选择的新值进行更新。

      任何帮助?

      更新1: 我可以在视图中获取Model.CheckboxSelections中的所有项目。我不想使用局部视图。我正在尝试类似下面的内容,但仍然缺少某些内容。

               @for (int i = 0; i < Model.CheckboxSelections.Count; i++)
              {
      @Html.CheckBox(Model.CheckboxSelections[i].Sku.ToString(), Model.CheckboxSelections[i].IsChecked.ToString())
           }
      

1 个答案:

答案 0 :(得分:11)

冒着重复自己的风险,我会用以下句子开始回答:

  

与ASP.NET MVC应用程序一样,您应该使用视图模型。

所以:

public class MyViewModel
{
    public string Name { get; set; }
    public bool IsChecked { get; set; }
}

然后是控制器:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        // Those are your domain models
        // they could come from a database or something
        var listA = new[] { "Item 1", "Item 2", "Item 3", "Item 4", "Item 5" };
        var listB = new[] { "Item 1", "Item 2", "Item 3", "Item 4", "Item 5", "Item 6", "Item 7", "Item 8", "Item 9", "Item 10" };

        // Now let's map our domain model to our view model
        var model = listB.Select(x => new MyViewModel
        {
            Name = x,
            IsChecked = listA.Contains(x)
        });

        return View(model);
    }

    [HttpPost]
    public ActionResult Index(IEnumerable<MyViewModel> model)
    {
        var selectedItems = model.Where(x => x.IsChecked);
        var format = string.Join(",", selectedItems.Select(x => x.Name));
        return Content("Thank you for selecting " + format);
    }
}

然后是相应的视图(~/Views/Home/Index.cshtml):

@model IEnumerable<MyViewModel>

@using (Html.BeginForm())
{
    @Html.EditorForModel()
    <button type="submit">OK</button>
}

最后是相应的编辑器模板,它将自动为模型集合的每个元素(~/Views/Home/EditorTemplates/MyViewModel.cshtml)呈现:

@model MyViewModel

<div>
    @Html.HiddenFor(x => x.Name)
    @Html.LabelFor(x => x.IsChecked, Model.Name)
    @Html.CheckBoxFor(x => x.IsChecked)
</div>

并且渲染结果(我的Chrome浏览器可见)如下所示:

enter image description here

看看使用视图模型有多容易?