将选定的multiSelectList项目保存回模型

时间:2015-12-15 20:48:41

标签: c# asp.net-mvc multi-select

我正在一个网站上工作,我有一个类别的MultiSelectList。每个项目可以属于多个类别,显然每个类别可以有很多项目。我在视图中的下拉列表中选择了正确的项目。但是一旦我保存,我就无法弄清楚如何将所选项目保存回模型中。

这是我的模特:

public class WebItem
{
    public string ImId { get; set; }
    public string itemRef { get; set; }
    public string name { get; set; }
    public string Image { get; set; }
    public string NUTS { get; set; }
    public string description { get; set; }
    public string ingredients { get; set; }
    public string allergens { get; set; }
    public string price { get; set; }
    public string saleprice { get; set; }
    public string quantity { get; set; }
    private const string DEFAULT_USERNAME = "amyb";
    private string _username = DEFAULT_USERNAME;
    public string username { 
        get { return _username; }
        set { _username = value; }
    }
    [Display(Name = "Active?")]
    public bool active { get; set; }
    [Display(Name = "Order online?")]
    public bool orderonline { get; set; }
    [Display(Name = "Food?")]
    public bool isfood { get; set; }
    [Display(Name = "Frozen?")]
    public bool isfrozen { get; set; }
    [Display(Name = "Overstock?")]
    public bool isoverstock { get; set; }    
    public string activedate { get; set; }
    //public int[] catIDs { get; set; }
    public List<Category> Categories { get; set; }
    public IEnumerable<SelectListItem> categories { get; set; }

    private List<int> selectedCategories;
    public List<int> SelectedCategories
    {
        get
        {
            if (selectedCategories == null)
            {
                selectedCategories = Categories.Select(m => int.Parse(m.catID)).ToList();
            }
            return selectedCategories;
        }
        set { selectedCategories = value; }
    }

}

public class Category
{
    public Category()
    {

    }

    public Category(string catID, string name, string longname)
    {
        this.catID = catID;
        this.name = name;
        this.longname = longname;
    }

    public string catID { get; set; }
    public string name { get; set; }
    public string longname { get; set; }
}

相关控制器代码:

public ActionResult UpdateItem(string ImId)
    {
        WebItem item = new WebItem();
        List<Category> categories = HomeModel.getAllCategories();

        //var selectCategories = categories.Select(c => new
        //{
        //    CategoryID = c.catID,
        //    CategoryName = c.longname
        //}).ToList();

        //item.categories = new MultiSelectList(selectCategories, "CategoryID", "CategoryName");

        item.categories = categories.Select(c => new SelectListItem
        {
            Text = c.name,
            Value = c.catID
        });

        if (ImId != null && !ImId.Equals(""))
        {
            string query = "SELECT 'Image', 'NUTS', ...";

            MySqlConnection con;
            //WebItem item = new WebItem();
            try
            {
                con = new MySqlConnection();
                con.ConnectionString = appConfig._...;
                con.Open();

                item = con.Query<WebItem>(query, new { imid = ImId }).FirstOrDefault();
                string activedate = item.activedate;
                if (activedate.Contains(' '))
                {
                    string[] activedates = activedate.Split(' ');
                    item.activedate = activedates[0];
                }
                //List<Category> categories = HomeModel.getAllCategories();

                //var selectCategories = categories.Select(c => new
                //{
                //    CategoryID = c.catID,
                //    CategoryName = c.longname
                //}).ToList();

                query = "SELECT ...";

                try
                {
                    item.SelectedCategories = con.Query<int>(query, new { pid = ImId }).ToList();
                }
                catch (MySqlException ex)
                {

                }

                //item.categories = new MultiSelectList(selectCategories, "CategoryID", "CategoryName", item.catIDs);

            }
            catch (MySqlException ex)
            {
                // show error somehow
                //return View(ex.Message);
            }

        }
        return View(item);
    }

    [HttpPost]
    public ActionResult UpdateItem(WebItem item)
    {

        string result = HomeModel.insertUpdateItem(item);
        TempData["Message"] = item.name + " has been inserted/updated.";
        return RedirectToAction("WebItems");
    }

我认为的相关部分:

<div class="form-group">
        @Html.LabelFor(model => model.categories, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @*@Html.DropDownList("category", (MultiSelectList)Model.categories, new { multiple = "multiple", htmlAttributes = new { @class = "form-control" } })*@
            @Html.ListBoxFor(m => m.SelectedCategories, Model.categories)
            @Html.ValidationMessageFor(model => model.categories, "", new { @class = "text-danger" })
        </div>
    </div>

我目前没有任何代码可以处理我的[HttpPost]部分中的类别。但我确定我需要一些东西。而且我不确定我的模型或视图是否正确。

1 个答案:

答案 0 :(得分:1)

您可以向vie wmodel添加数组类型的新属性,以存储多选框中的选定选项。当表单发布时,MVC模型绑定将正确地将选定值绑定到此视图模型的对象只要我们在HttpPost动作方法中将其作为参数。

public class CreateWebItem
{ 
  public string Name{ get; set; }
  public List<SelectListItem> Categories { set; get; }
  public int[] SelectedCategories { set; get; }
  //Add other properties NEEDED FOR THE VIEW
}

在你的GET行动中

public ActionResult Create()
{
  var vm = new CreateWebItem();
  //Hard coded for demo. you may replace with values from db
  v.Categories = new List<SelectListItem>
  {
    new SelectListItem { Value="1", Text="Dinner" },
    new SelectListItem { Value="2", Text="Lunch" },
    new SelectListItem { Value="3", Text="Snacks" },
    new SelectListItem { Value="4", Text="Drinks" }
  };
  return View(vm);
}

在你的剃刀视图中,它是CreateWebItem视图模型的强类型。

@model CreateWebItem
@using (Html.BeginForm())
{
   <label>FirstName </label>@Html.TextBoxFor(d => d.Name)
   <label>Categories</label>
   @Html.ListBoxFor(s=>s.SelectedCategories,Model.Categories)
   <input  type="submit" value="Add" />
}

当表单发布时,您可以使用SelectedCategories属性获取Id(所选选项中)的数组

 [HttpPost]
 public ActionResult Index(CreateWebItem model)
 {
    //read model.SelectedCategories array
    // to do : Save to somewhere and do a redirect (PRG pattern)
 }