MVC 5 - MultiSelectList,使用Model"SelectList"属性绑定值

Question

在我的MVC项目中,我遇到了将MultiSelectLists与我的Model属性绑定的问题.虽然我可以通过FormCollection对象获取值,但这些只是Selected ID.

以下是我的模型类,代表一个帖子.

public class PostModel
{
    [Required(ErrorMessage = "Id is a required field")]
    public int Id { get; set; }

    [Required(ErrorMessage = "Post Title is required")]
    [StringLength(500)]
    public string Title { get; set; }

    .......

    public SelectList UnassignedTags { get; set; }
    public SelectList AssignedTags { get; set; }
}

请注意,这只是一个Model类,并且有两个附加属性(UnassignedTags和AssignedTags),仅用于在屏幕上显示它们以及保持调用之间的值绑定.

单个帖子可以标记多个标签.在我的视图中,我想要两个多选列表.一个用于保存未分配的标签(文本和值),另一个用于保存已分配的标签(文本和值).

在我的视图中,我使用以下代码显示这些列表的多选列表.

@Html.ListBox("UnassignedTagss", Model.UnassignedTags, new { @class = "form-control" })

@Html.ListBox("AssignedTagss", Model.AssignedTags, new { @class = "form-control" })

当我在屏幕上加载记录时,一切都很好.

加载后,我让用户通过javascript在列表之间移动项目.

当Form返回版本时会出现问题.我无法将Listbox值与我的模型属性绑定.

以下是我显示/编辑帖子记录的操作方法.

public ActionResult PostDtls(int postId)
{
    …..
}

[HttpPost]
public ActionResult PostDtls(PostModel post, FormCollection collection)
{
    …….
}

有没有什么办法可以将ListBox项目(无论选择与否)绑定到我的Model SelectList属性,即UnAssignedTags和AssignedTags？

目前,我在将表单发回服务器之前,通过JQuery选择了ListBox的所有项目.这样,我在FormCollection对象中得到逗号分隔的ID.但问题是,如果由于Invalid ModelState而必须向用户重新显示视图,我必须根据FormCollection对象中可用的ID从数据库中获取标记.我知道上面的解决方案很糟糕.我需要了解实施此要求的好方法.

Answer 1

我不确定你为什么采取这种方法.您需要的第一件事是视图模型中的另外两个属性(我假设值类型是int)

public int[] SelectedUnassignedTags { get; set; }
public int[] SelectedAssignedTags  { get; set; }

然后创建DropDownLists如下

@Html.ListBoxFor(m => m.SelectedUnassignedTags, Model.UnassignedTags, ...)
@Html.ListBoxFor(m => m.SelectedUnassignedTags, Model.UnassignedTags, ...)

在回发,SelectedUnassignedTags并且SelectedAssignedTags将包含已在各自的列表框被选中的值,因此,例如,如果你选择了这两个选项

<option value="2">Item No 2</option>
<option value="4">Item No 4</option>

那么SelectedUnassignedTags将是一个包含2和4的数组

在你发布方法(看不到任何需要FormCollection)

public ActionResult PostDtls(PostModel post)
{
  if (!ModelState.IsValid())
  {
    // Repopulate you select lists (as you would have done in the get method)
    return View(post);
  }
}

尝试构建所有必要的选项值,相关文本和javascript中的选定状态并回发那些额外的数据,然后在post方法中重建它们可能比数据库调用更昂贵(当然,你可以总是缓存它们以避免调用数据库)