将多选选择绑定到对象列表

本文关键字:对象 列表 绑定 选择 | 更新日期: 2023-09-27 17:55:41

我有一个这样的视图模型:

public class ListingPlanEditorViewModel
{
    public ListingPlan Plan { get; set; }
    public IEnumerable<Directory> SiteDirectories { get; set; }
}

一个属性是此处的 ListingPlan 类型的对象:

public class ListingPlan
{
    public int? ListingPlanID { get; set; }
    public int DescriptionLinesCount { get; set; }
    public List<Directory> Directories { get; set; }
}

对象目录如下所示:

public class Directory
{
    public int DirectoryID { get; set; }
    public string Name { get; set; }
    public string Description { get; set; }
}

我有一个控制器,它将列表计划编辑器视图模型返回到视图:

   public ActionResult ConfigurePlan(int? listingIdentifier)
    {
        ListingPlan plan = new ListingPlan()
        {
            DescriptionLinesCount = 10,
            Directories = new List<Directory>()
            {
                new Directory()
                {
                    DirectoryID = 3
                },
                new Directory()
                {
                    DirectoryID = 4
                }
            }
        };
        ListingPlanEditorViewModel model = new ListingPlanEditorViewModel()
        {
            Plan = plan,//_listingRepository.GetListingPlan(listingIdentifier, null),
            SiteDirectories = _database.GetDirectories()
        };
        return View(model);
    }

我想创建一个多选框,该框将所选值绑定回列表计划编辑器视图模型中的计划属性,为每个选择设置 DirectoryID 属性。所以绑定后,我应该有一个目录对象列表。所有这些都带有他们的目录 ID 集。

我在做这件事时遇到了一些麻烦。我可以创建包含正确选择选项的多选框,但我无法在我的后期操作中检索它们,如下所示:

@using (Html.BeginForm("ConfigurePlan", "ListingPlan"))
{
    <div class="form-body">
        @Html.ListBoxFor(model => model.Plan.Directories, new MultiSelectList(Model.SiteDirectories, "DirectoryID", "Name"))
</div>
<button type="submit">submit</button>
}

将多选选择绑定到对象列表

您必须在 ViewModel 中创建将存储所选值的[]IDs List

public class ListingPlanEditorViewModel
{
    public ListingPlan Plan { get; set; }
    public IEnumerable<Directory> SiteDirectories { get; set; }
    public int[] DirectoryIDs {get;set;}
}

视图将相应地更改。所选目录将存储在 DirectoryIDs 中。

@using (Html.BeginForm("ConfigurePlan", "ListingPlan"))
{
    <div class="form-body">
        @Html.ListBoxFor(model => model.DirectoryIDs, new MultiSelectList(Model.SiteDirectories, "DirectoryID", "Name"))
    </div>
    <button type="submit">submit</button>
}

现在,在POST操作中,您可以查询数据库并获取用户选择的Directories

注意:您不能只获取完整的对象,因为ListBoxFor会生成一个<select multiple ... > ... </select>标签,而标签不知道如何绑定到您的对象。