MVC Razor Viewで複数のフォームを単一のビューモデルで転記する

Question

私は5つのフォームを含むかみそりビューを持っています。 （A、B、C、D、E）である。これらのフォームには、それぞれ独自のViewModel（AViewModel、BViewModel、CViewModel、DViewModel、EViewModel）があります。

ページを唯一のViewModelとして使用する親ProductViewModelを作成しました。このViewModel内には、ページ上の各フォームの他のすべてのViewModelが表示されます（上にリストされています）。ここで

はProductViewModelの性質がどのように見えるかです：

public AViewModel { get; set; } 
public BViewModel { get; set; } 
public CViewModel { get; set; } 
public DViewModel { get; set; } 
public EViewModel { get; set; } 

マイかみそりビューは、次のようになります。

保存]ボタンを私が終わるクリックされた

@model MVCApp.ViewModels.ProductViewModel 

@{ 
    ViewData["Title"] = "Product Detail"; 
} 

<h2>Product Detail</h2> 

<form asp-controller="A" asp-action="Save" data-ajax="true" data-ajax-method="POST"> 
    <div class="form-horizontal"> 
     <h4>Form A</h4> 
     <hr /> 
     <div asp-validation-summary="ModelOnly" class="text-danger"></div> 
     <div class="form-group"> 
      <label asp-for="AViewModel.Name" class="col-md-2 control-label"></label> 
      <div class="col-md-10"> 
       <input asp-for="AViewModel.Name" class="form-control"/> 
       <span asp-validation-for="AViewModel.Name" class="text-danger" /> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label asp-for="AViewModel.StartDate" class="col-md-2 control-label"></label> 
      <div class="col-md-10"> 
       <input asp-for="AViewModel.StartDate" class="form-control"/> 
       <span asp-validation-for="AViewModel.StartDate" class="text-danger" /> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label asp-for="AViewModel.EndDate" class="col-md-2 control-label"></label> 
      <div class="col-md-10"> 
       <input asp-for="AViewModel.EndDate" class="form-control"/> 
      </div> 
     </div> 
     <div class="form-group"> 
      <div class="col-md-offset-2 col-md-10"> 
       <input type="submit" value="Create" class="btn btn-default" /> 
      </div> 
     </div> 
    </div> 
</form> 

<div> 
    <a asp-action="Index">Back to List</a> 
</div> 

@section Scripts { 
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");} 
} 

ちょうど私が期待するAコントローラの（POST）アクションメソッドを保存します。

[HttpPost] 
    [ValidateAntiForgeryToken] 
    public IActionResult Save(AViewModel viewModel) 
    { 
     return Ok(); 
    } 

しかし、私はviewModel paramのすべてのプロパティが空であることに気付きました。

これは、スコープ内のViewModelだけが移入され、その他すべてがnullになる5つのフォームのすべてに対して、ProductModelオブジェクトをViewModelとしてアクションの保存メソッドに渡す必要があることを意味しますか？それとも良い方法がありますか？

Answer 1

は、部分的なビューを形成して、部分的にご入力は

に

<input asp-for="AViewModel.Name" class="form-control"/> 

から変更することができ、親モデル

@{await Html.RenderPartialAsync("AViewPartial", Model.AViewModel); } 

から必要なだけサブモデルに渡します

<input asp-for="Name" class="form-control"/> 

モデルバインダーで正しくバインドする必要があります。アクション

Answer 2

POSTメソッドのパラメータは、ProductViewModelである必要があります。

この理由が原因プロパティがあなたのHTMLで命名されている方法である

：

<input asp-for="AViewModel.Name" class="form-control"/> 

モデルバインダーは、あなたのシリアライズ形式を取り、あなたはPOSTメソッドに値を送っていることを見ていますプロパティはAViewModel.Nameとなります。あなたのパラメータがタイプAViewModelである場合、それはAViewModelの名前を使用してパラメータの型の子プロパティを探して、次に入力の値にそのオブジェクトのNameプロパティを割り当てているため、それは、何かを見つけることはありません。

各POSTメソッドのパラメータをProductViewModelにしたくない場合は、5つの異なるフォームの部分ビューを作成し、モデルとしてProductViewModelの個々のプロパティを渡します部分図の場合はこれにより、asp-for属性のAViewModelプロパティプレフィックスが削除されます。私はそれぞれを作る示唆