Ajax経由でフォームにViewModelを渡す

Question

Scheduleモデルに対応するいくつかのフィールドをユーザーが入力できる表形式があります。また、ScheduleのプルダウンからUserを選択することもできます。すべての必要なデータをビューに送信するには、ViewModelには、Scheduleと、システム内のすべてのユーザーを含むIEnumerable<SelectListItem>が含まれています。

私のコントローラでは、ListをSchedulingViewModelsと作成します。その後、私はAjaxを介して、私のビューにPartialViewをロード

@model List<JNEScheduling.Models.SchedulingViewModel> 

... 

<tbody> 
@for (int i = 0; i < Model.Count; i++) 
{ 
    <tr> 
     <td> 
      @Html.HiddenFor(m => m[i].ID) 
      @Html.DropDownListFor(m => m[i].schedule.UserID, Model[i].users) 
     </td> 
     <td> 
      @Html.TextBoxFor(m => m[i].schedule.hours) 
     </td> 
     <td> 
      @Html.TextBoxFor(m => m[i].schedule.week_ending) 
     </td> 
     </tr> 
    } 
    <tr> 
</tbody> 

：私は、PartialView（私は唯一の関連する部分を含めました）にList<SchedulingViewModel>を渡します。ローディングは正常に動作します。ただし、フォームがPOST edの場合は、空のScheduleオブジェクトのリストをControllerに渡しますが、予期したとおりに、埋め込まれたSchedulingViewModelオブジェクトのリストは渡されません。

フォーム上のすべての入力のDOM名と関係があると思います。 [index].schedule.hoursなどの形をとります。スケジューリングビューモデルオブジェクトのリストを返すにはどうすればよいですか？またはListがScheduleのオブジェクトであっても問題ありません。 POSTため

のjQuery：

$('#submitButton').click(function() { 
    var content = $("form").serialize(); 
    $.ajax({ 
     type: 'POST', 
     url: '@Url.Action("Table", "Schedule")', 
     data: content, 
     success: function (data) { 
      $('#hoursTable').html(data); 
    } 
}); 

更新：PartialViewからアヤックスGETによって生成されたテーブルの 1行、ブライアンのSchedulingContainerViewModelを使用した後。

<tr> 
    <td> 
     <input name="Items[0].ID" type="hidden" value="0" /> 
     <select name="Items[0].schedule.UserID"> 
      <option selected="selected" value="1">User 1</option> 
      <option value="2">User 2</option> 
      <option value="3">User 3</option> 
      <option value="4">User 4</option> 
      <option value="5">User 5</option> 
     </select> 
    </td> 
    <td> 
     <input name="Items[0].schedule.hours" type="text" value="40.00" /> 
    </td> 
    <td> 
      <input name="Items[0].schedule.week_ending" type="text" value="5/26/2017 12:00:00 AM" /> 
    </td> 
</tr> 

アップデート2：XHRデータが戻って渡される：

Answer 1

命名構造は、右に見える私は@Html方法によって生成された検証タグを削除しました。

public class ScheduleContainerViewModel 
{ 
    public List<SchedulingViewModel> Items { get; set;} 
} 

レンダリングするでしょう：

Items[index].schedule.hours 

私はこのアプローチを使用し、それは私のプロジェクトで動作し、時には、リストを使用するのではなく、私のようなラッパークラスを追加します。