Asp.Net MVC3剃须刀 - 子项列表中未从编辑器回发 [英] Asp.Net MVC3 Razor - child items list not posting back from editor

问题描述

我试图创建一个MVC3多层次的编辑器。通过多层次的我的意思是，我想能够为三层结构（父对象，父项的子对象，子子对象的集合）编辑数据。我的模型大致是这样的：

I'm trying to create a multi-level editor in MVC3. By multi-level I mean that I would like to be able to edit data for three levels of hierarchy (parent object, parent's child object and collection of sub-child objects). My model roughly looks like:

namespace MvcApplication1.Models
{
    public class Parent
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public Child Child { get; set; }
    }

    public class Child
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public IEnumerable<SubChild> SubChildren { get; set; }    
    }

    public class SubChild
    {
        public int Id { get; set; }
        public string Name { get; set; }
        private DateTime _date = DateTime.Now;
        public DateTime Date { get { return _date; } set { this._date = value; } }
    }
}

因为我想显示在一个屏幕上我创建了以下视图模型的整个层次：

Since I want to display the whole hierarchy on one screen I created the following view model:

namespace MvcApplication1.Models.ViewModels
{
    public class ParentViewModel
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public Child Child { get; set; }
        public IEnumerable<SubChild> SubChildren { get { return Child.SubChildren; } set { this.Child.SubChildren = value; } }
    }
}

和控制器是如下：

    public class ParentController : Controller
    {
        public ActionResult MultiLevelEdit(int id)
        {
            // Simulate data retrieval 
            Parent parent = new Parent { Id = 2 , Name = "P"};
            var child = new Child { Id = 3, Name = "Cild1" };
            List<SubChild> children = new List<SubChild>();
            children.Add(new SubChild { Id = 3, Name = "S1"});
            children.Add(new SubChild { Id = 5, Name = "S 22" });
            child.SubChildren = children;
            parent.Child = child;
            // Create view model
            ParentViewModel vm = new ParentViewModel() { Id = parent.Id, Name = parent.Name, Child = parent.Child, SubChildren = parent.Child.SubChildren };

            return View(vm);
        }

    }

查看被渲染为：

@model MvcApplication1.Models.ViewModels.ParentViewModel

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

    @Html.HiddenFor(model => model.Id)
    @Html.LabelFor(model => model.Name)
    @Html.EditorFor(model => model.Name)
    <hr />
    Child
    <br />
    @Html.EditorFor(model => model.Child)

    <hr />
    SubChild
    <br />
    @Html.EditorFor(model => model.SubChildren)


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

我在浏览\\共享\\ EditorTemplates创建了两个编辑模板：

I have created two editor templates in the Views\Shared\EditorTemplates :

ChildTemplate.cshtml

ChildTemplate.cshtml

@model MvcApplication1.Models.Child

@{
    ViewBag.Title = "Child";
}

<h2>Child</h2>

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

        @Html.HiddenFor(model => model.Id)

        <div class="editor-label">
            @Html.LabelFor(model => model.Name, "Child Name")
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Name)
            @Html.ValidationMessageFor(model => model.Name)
        </div>
    </fieldset>
}

和SubChildTemplate.cshtml

and SubChildTemplate.cshtml

@model MvcApplication1.Models.SubChild

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

        @Html.HiddenFor(model => model.Id)

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

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

一切正确​​呈现，但是当我尝试保存的更改SubChildren集合为null。
我试过编辑方法的两个签名：

Everything renders correctly, however when I try to save the changes the SubChildren collection is null. I tried two signatures of the edit method:

[HttpPost]
public ActionResult MultiLevelEdit(ParentViewModel parentVM)
{...

[HttpPost]
public ActionResult MultiLevelEdit(ParentViewModel parentVM, FormCollection collection)
{...

和有在任何这些没有价值。

and there is no value in any of those.

任何人都可以提出什么可以改进，使这项工作？
感谢很多提前。

Can anyone suggest What could be improved to make that work? Thanks a lot in advance.

推荐答案

您模板不正确命名。应该是：

Your templates are not named correctly. Should be:

• 〜/查看/共享/ EditorTemplates / Child.cshtml


• 〜/查看/共享/ EditorTemplates / SubChild.cshtml

• ~/Views/Shared/EditorTemplates/Child.cshtml
• ~/Views/Shared/EditorTemplates/SubChild.cshtml

此外，我不很明白您的视图模型的 SubChildren 财产的目的。

Also I don't quite see the purpose of the SubChildren property on your view model.

您可以删除它，在你的主视图：

You could remove it and in your main view:

@model MvcApplication1.Models.ViewModels.ParentViewModel

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

    @Html.HiddenFor(model => model.Id)
    @Html.LabelFor(model => model.Name)
    @Html.EditorFor(model => model.Name)
    <hr />
    Child
    <br />
    @Html.EditorFor(model => model.Child)

    <hr />
    SubChild
    <br />
    @Html.EditorFor(model => model.Child.SubChildren)

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

但你最大的问题是，你有嵌套HTML ＆LT;形式为GT; 这是不允许的元素。这是无效的HTML和成果转化为未定义的行为。有些值可能被张贴，别人不要，...从内你的模板移除所有 Html.BeginForm 助手，因为你的主视图中包含的一种形式。

But your biggest problem is that you have nested HTML <form> elements which is not allowed. It's invalid HTML and results into undefined behavior. Some values might be posted, others not, ... Remove all Html.BeginForm helpers from inside your templates because your main view already contains a form.

这篇关于Asp.Net MVC3剃须刀 - 子项列表中未从编辑器回发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！