4

MVC3 でマルチレベル エディターを作成しようとしています。マルチレベルとは、3 レベルの階層 (親オブジェクト、親の子オブジェクト、サブ子オブジェクトのコレクション) のデータを編集できるようにしたいという意味です。私のモデルはおおよそ次のようになります。

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; } }
    }
}

階層全体を 1 つの画面に表示したいので、次のビュー モデルを作成しました。

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>
}

Views\Shared\EditorTemplates に 2 つのエディター テンプレートを作成しました。

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

@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 になります。edit メソッドの 2 つのシグネチャを試しました。

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

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

そして、それらのどれにも価値はありません。

誰かがそれを機能させるために何を改善できるかを提案できますか? よろしくお願いします。

4

2 に答える 2

5

テンプレートの名前が正しくありません。次のようにする必要があります。

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

SubChildrenまた、ビューモデルのプロパティの目的がよくわかりません。

あなたはそれを削除することができ、あなたのメインビューで：

@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>
}

しかし、最大の問題は、<form>許可されていないネストされた HTML 要素があることです。これは無効な HTML であり、未定義の動作を引き起こします。投稿される値もあれば、投稿されない値もあります...Html.BeginFormメイン ビューには既にフォームが含まれているため、テンプレート内からすべてのヘルパーを削除します。

于 2012-01-18T17:16:00.097 に答える
1

解決策については、この記事を参照してください。魔法は using(Html.BeginCollectionItem("...")) ブロックに含まれています。

つまり、デフォルトのモデルバインダーを使用する場合は、正しいフィールド名/プレフィックスを使用する必要があります。

于 2012-01-18T17:18:06.737 に答える