无法获取选定的下拉值以绑定到视图模型属性

Question

我无法将下拉列表的选定值绑定到我的视图模型中的正确属性。我看不出我在这里做错了什么。我已经把应该有助于显示我在做什么的代码放在下面。我省略了一些内容，例如视图模型的“AllFolders”属性的填充，因为它只是一个简单的列表，其中包含一个名为 ImageGalleryFolder 的对象。

每次回发表单时，ParentFolderId 属性都会为 null 且不会失败。这让我发疯了，我浪费了很多时间来解决这个问题。

谁能看出我做错了什么？

这是视图模型

public class ImageGalleryFolderViewModel
{
    [Required]
    public string Title { get; set; }

    public int Id { get; set; }
    public string CoverImageFileName { get; set; }
    public HttpPostedFileBase UploadedFile { get; set; }
    public string ParentFolderId { get; set; }
    public IList<ImageGalleryFolder> AllFolders { get; set; } 
}

这是查看代码

@using Payntbrush.Presentation.Demo.MVC3.Areas.Admin
@model Payntbrush.Presentation.Demo.MVC3.Areas.Admin.Models.ImageGalleryFolderViewModel

@{
    ViewBag.Title = "Create A New Gallery Folder";
}

<h2>@ViewBag.Title</h2>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

@using (Html.BeginForm((string)ViewBag.Action + "Folder", "Portfolio", FormMethod.Post, new { Id = "CreateFolder", enctype = "multipart/form-data" }))
{
    @Html.ValidationSummary(true)

        if(((string)ViewBag.Action).ToLower() == FormConstants.Edit.ToLower())
        {
            @Html.HiddenFor(m => m.Id)
            @Html.HiddenFor(m => m.CoverImageFileName)
            @Html.HiddenFor(m => m.ParentFolderId)
        }

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

        <div class="editor-label">
            @Html.LabelFor(model => model.UploadedFile)
        </div>
        <div class="editor-field">
            <input type="file" name="UploadedFile"/>
            @Html.ValidationMessageFor(model => model.UploadedFile)
        </div>


    {
        // Count > 1 is important here. If there is only 1 folder, then we still don't show the drop down
        // as a child folder can't have itself as it's own parent.
    }
    if(@Model.AllFolders.Count > 1)
         {
             <div class="editor-label">
                 Choose a parent folder (optional)
             </div>
             <div class="editor-field">
                    @Html.DropDownListFor(m => m.ParentFolderId, new SelectList(Model.AllFolders, "Id", "Title"))
             </div>


         }


    <p>
            <input type="submit" value="Save" />
        </p>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

我省略了我的视图，但这就是我的表单在浏览器中呈现时的样子。表单看起来不错？

   <form Id="CreateFolder" action="/SlapDaBass/Portfolio/EditFolder/1" enctype="multipart/form-data" method="post">
<input data-val="true" data-val-number="The field Id must be a number." data-val-required="The Id field is required." id="Id" name="Id" type="hidden" value="1" />
<input id="CoverImageFileName" name="CoverImageFileName" type="hidden" value="" />
<input id="ParentFolderId" name="ParentFolderId" type="hidden" value="" />        


<div class="editor-label">

             <label for="Title">Title</label>

            </div>

            <div class="editor-field">

                <input class="text-box single-line" data-val="true" data-val-required="The Title field is required." id="Title" name="Title" type="text" value="Test" />

                <span class="field-validation-valid" data-valmsg-for="Title" data-valmsg-replace="true"></span>

            </div>

            <div class="editor-label">

                <label for="UploadedFile">UploadedFile</label>

            </div>

            <div class="editor-field">

                <input type="file" name="UploadedFile"/>

                <span class="field-validation-valid" data-valmsg-for="UploadedFile" data-valmsg-replace="true"></span>

            </div>

                 <div class="editor-label">

                     Choose a parent folder (optional)

                 </div>

                 <div class="editor-field">

                        <select id="ParentFolderId" name="ParentFolderId">
                           <option value="1">Test</option>
                           <option value="2">Test 2</option>

                         </select>

                 </div>

        <p>

                <input type="submit" value="Save" />

            </p>

    </form>

这是控制器动作：

[HttpPost]
        public ActionResult EditFolder(int id, ImageGalleryFolderViewModel model)
        {
            if (ModelState.IsValid)
            {
                Services.PortfolioService.UpdateFolder(model.MapToDomainModel(), model.UploadedFile);
                return Home;
            }
            return View();
        }

Answer 1

更改ParentFolderId的数据类型

public class ImageGalleryFolderViewModel
{
    [Required]
    public string Title { get; set; }

    public int Id { get; set; }
    public string CoverImageFileName { get; set; }
    public HttpPostedFileBase UploadedFile { get; set; }
    public int ParentFolderId { get; set; }
    public IList<ImageGalleryFolder> AllFolders { get; set; } 
}

还可以为下拉列表使用 Html 帮助器

<%: 
     Html.DropDownListFor(
           model => model.ParentFolderId , 
           new SelectList(
                  new List<Object>{ 
                       new { value = 1 , text = "Test"  },
                       new { value = 2 , text = "Test2" },
                       new { value = 3 , text = "Test3"}
                    },
                  "value",
                  "text"
           )
        )
%>

我希望你像

一样强烈地输入你的视图

    public ActionResult EditFolder()
    {

        return View(new ImageGalleryFolderViewModel());
    }

Answer 2

请参阅以下链接以获取绑定下拉列表。对你很有帮助。

ASP.NET MVC - drop down list selection - partial views and model binding

如果您不想在模型中为项目列表创建属性，也可以将其存储在 ViewData 或 ViewBag 中。请在下面找到示例代码。

<%= Html.DropDownList("Category.CategoryId", new SelectList((
IEnumerable<ProductManagement.Models.Category>)ViewData["CategoryList"],
"CategoryId", "CategoryName"))%>

Answer 3

您正在为 ParentFolderId 创建一个具有空值的隐藏输入。这可能会覆盖 DropDownList 尝试发布的值。删除这一行：

@Html.HiddenFor(m => m.ParentFolderId)

Answer 4

ParentFolderId 有 2 个元素

其中一个是隐藏字段

@Html.HiddenFor(m => m.ParentFolderId)  

第二个是选择元素

@Html.DropDownListFor(m => m.ParentFolderId, new SelectList(Model.AllFolders, "Id", "Title")) 

和 modelbinder 将第一个匹配的元素值绑定到模型。

你必须删除隐藏字段