如何在 MVC 4 中动态创建复选框或多选答案

【问题标题】：How to dynamically create checkboxes OR multi select on MVC 4如何在 MVC 4 中动态创建复选框或多选
【发布时间】：2012-11-06 09:48:42
【问题描述】：

在这个项目中，我们有两个列表，一个是经销商，第二个是他的产品。

到目前为止，如果您检查一个经销商，我们会取回该特定经销商的所有产品，它是用 javascript (Json) 实现的。

HTML (5 :)

@using (Html.BeginForm()) {
@Html.ValidationSummary(true)
<fieldset>
    <legend>DealerProduct</legend>

     <div class="editor-label">
        @Html.LabelFor(model => model.DealerID)
    </div>
    <div class="editor-field">
        @Html.DropDownList("DealerID", String.Empty)
        @Html.ValidationMessageFor(model => model.DealerID)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.ProductID)
    </div>
    <div class="editor-field">

        @Html.DropDownList("ProductID", String.Empty)
        @Html.ValidationMessageFor(model => model.ProductID)
    </div>
    <p>
        <input type="submit" value="@Shared.Add" />
    </p>
</fieldset>
}

JavaScript (Json :)

<script type="text/javascript">
$(document).ready(function() 
 {
  $("#DealerID").change(function ()
  {
       var self = $(this);
       var items="";
       var url = "";
       url = "@Url.Action("GetDealerProducts","DealerProduct")/"+self.val();
       $.ajaxSetup({ cache: false });
        $.getJSON(url,function(data)
        {   
          $.each(data,function(index,item)
          {
            items+="<option value='"+item.Value+"'>"+item.Text+"</option>\n";
          });
          $("#ProductID").html(items);
           $.ajaxSetup({ cache: true }); 
        });
    });       
 });
</script>

控制器：

public ActionResult GetDealerProducts(int id)
    {
        Dealer currentDealer = db.Dealers.Single(p => p.UserName == User.Identity.Name);
        Dealer subDealer = db.Dealers.Single(s => s.DealerID == id);


        List<Product> productOpenToSale = new List<Product>();

        foreach (var item in currentDealer.ProductToSale)
            if (!subDealer.ProductToSale.ToList().Exists(e => e.ProductID == item.ProductID))
                productOpenToSale.Add(item.Product);

        List<SelectListItem> productOpenToSaleList = new List<SelectListItem>();
        productOpenToSale.ForEach(item => productOpenToSaleList.Add(new SelectListItem { Value = item.ProductID.ToString(), Text = item.ProductName }));

        return Json(productOpenToSaleList, JsonRequestBehavior.AllowGet);
    }

我真正需要的是添加（一对）产品经销商，他可以在未来销售。

当前的选项是逐个添加产品，希望提供对所有产品进行多项选择的可能性。

可能是动态 checkBoxList 或 ViewModel 列表中添加输入的 foreach 之类的东西 - 复选框 like this，但我不知道在经销商在第一个列表中选择并接收所有选择后如何填充它产品重新提交..

10X 的任何帮助！（&&对不起我的英语不好:)

【问题讨论】：

标签： javascript json html c#-4.0 asp.net-mvc-4

【解决方案1】：

你可以改变这行代码

@Html.DropDownList("ProductID", String.Empty)

类似这样的东西

<select id="SelectedItemIds" multiple="multiple" name="SelectedItemIds">

并且像这样在服务器上有一个 viewModel

class MyViewModel
{
    public int[] SelectedItemIds { get; set; }
    public int DealerID {get;set;}
}

并且拥有这样的控制器

    [HttpPost]
    public ActionResult Index(MyViewModel myViewModel)
    {
        return View();
    }

【讨论】：

不错但是.. =) 从 DropDownList("DealerID" 选择经销商后，我需要在此 SelectedItemIds 上填写不同的产品
使用 ajax 只需将您想要的键值削减值并将其附加或插入到 SelectedItemIds 就像您在上面所做的一样

【解决方案2】：

我有类似的情况，并使它在这里工作： enter link description here

但我不知道如何将实际文本传回。我只能将所选项目的索引传递回控制器。如果你弄明白了，请告诉我。

确保您的选择名称与模型中的变量名称匹配。

【讨论】：