はどのように私は私が持っているのviewmodelを動的にAjaxを

Question

がロードされているdropdownlistsをバインドします：

public class RegistrationViewModel 
{ 
    public RegisterModel RegistrationData { get; set; } 
    public List<OccupierApartment> OccupierApartments { get; set; } 
    public List<Complex> Complexes { get; set; } // for complexes lookup  
} 

登録時に、利用者は、1つの以上の複合体を選択する必要があります。これらの値はOccupierApartmentsリストに格納されます。使用可能なコンプレックスはドロップダウンリストにロードされ、ViewBagに渡されます。

public PartialViewResult GetApartment() 
    { 
     var complexes = new SelectList(db.Complexes.ToList(), "ComplexID", "Name", "-- Select --"); 

     List<SelectListItem> occupierTypes = new List<SelectListItem>(); 
     occupierTypes.Add(new SelectListItem { Value = "Owner", Text = "Owner" }); 
     occupierTypes.Add(new SelectListItem { Value = "Tenant", Text = "Tenant" }); 

     //load Complex data. 
     ViewBag.Complexes = complexes; 
     ViewBag.OccupierTypes = occupierTypes; 
     return PartialView("_AddApartment"); 
    } 

ユーザーが登録ビューで「アパートを追加」をクリックすると、PartialViewが（ビューの近くに下を参照）Ajax.ActionLinkを使用して、テーブルに追加されます。すべてが正しくレンダリングされ、dropdownlistsがされていますデータが入力されていますが、ドロップダウンリストの選択値をビューモデルにバインドする方法がわかりません。

@model PropertyManager_MVC.Areas.Account.ViewModels.RegistrationViewModel 
@{ 
ViewBag.Title = "Register"; 
Layout = "~/Views/Shared/_Layout.cshtml"; 
} 

@using (Html.BeginForm()) 
{ 
@Html.ValidationSummary(true, "Account creation was unsuccessful. Please correct the errors and try again.") 
<div> 
    <fieldset> 
     <legend>Account Information</legend> 
     <div class="editor-label"> 
      @Html.LabelFor(m => m.RegistrationData.UserName) 
     </div> 
     <div class="editor-field"> 
      @Html.TextBoxFor(m => m.RegistrationData.UserName) 
      @Html.ValidationMessageFor(m => m.RegistrationData.UserName) 
     </div> 
     <div class="editor-label"> 
      @Html.LabelFor(m => m.RegistrationData.Email) 
     </div> 
     <div class="editor-field"> 
      @Html.TextBoxFor(m => m.RegistrationData.Email) 
      @Html.ValidationMessageFor(m => m.RegistrationData.Email) 
     </div> 
     <div class="editor-label"> 
      @Html.LabelFor(m => m.RegistrationData.Password) 
     </div> 
     <div class="editor-field"> 
      @Html.PasswordFor(m => m.RegistrationData.Password) 
      @Html.ValidationMessageFor(m => m.RegistrationData.Password) 
     </div> 
     <div class="editor-label"> 
      @Html.LabelFor(m => m.RegistrationData.ConfirmPassword) 
     </div> 
     <div class="editor-field"> 
      @Html.PasswordFor(m => m.RegistrationData.ConfirmPassword) 
      @Html.ValidationMessageFor(m => m.RegistrationData.ConfirmPassword) 
     </div> 
     <div class="editor-label"> 
      @Html.LabelFor(m => m.RegistrationData.FirstName) 
     </div> 
     <div class="editor-field"> 
      @Html.TextBoxFor(m => m.RegistrationData.FirstName) 
      @Html.ValidationMessageFor(m => m.RegistrationData.FirstName) 
     </div> 
     <div class="editor-label"> 
      @Html.LabelFor(m => m.RegistrationData.LastName) 
     </div> 
     <div class="editor-field"> 
      @Html.TextBoxFor(m => m.RegistrationData.LastName) 
      @Html.ValidationMessageFor(m => m.RegistrationData.LastName) 
     </div> 
     <br /> 
     <hr /> 
     <h2> 
      Your Apartment(s)</h2> 

     <table id="newApartment"> 
      <thead> 
       <tr> 
        <td> 
         Occupier Type 
        </td> 
        <td> 
         Complex 
        </td> 
        <td> 
         Apartment No. 
        </td> 
        <td> 
        </td> 
       </tr> 
      </thead> 
      <tbody id="tableBody"> 
      </tbody> 
     </table> 
     <br /> 
     @Ajax.ActionLink("Add Apartment", 
         "GetApartment", 
         new AjaxOptions 
         { 
          UpdateTargetId = "tableBody", 
          HttpMethod = "GET", 
          InsertionMode = InsertionMode.InsertAfter, 
         }) 
     <hr /> 
     <p> 
      <input type="submit" value="Register" /> 
     </p> 
    </fieldset> 
</div> 
} 

そして、ここではPartialView

@model PropertyManager_MVC.Areas.Account.ViewModels.RegistrationViewModel 

<tr class="editorRow"> 
    <td>@Html.DropDownList("OccupierTypes", (IEnumerable<SelectListItem>)ViewBag.OccupierTypes, "-- Select --") 
    </td> 
    <td> 
     @Html.DropDownList("ComplexID", (IEnumerable<SelectListItem>)ViewBag.Complexes, "-- Select --") 
    </td> 
    <td> 
     @Html.TextBox("ApartmentNo") 
    </td> 
    <td> 
     <a href="#" class="deleteRow">Remove</a> 
    </td> 
</tr> 

Answer 1

である私は、可変長リストの編集を実現するために、あなたにfollowing articleをお勧めします。これは、入力フィールドの名前を歪ませずに要素の追加と削除を可能にするコレクションインデックスをGUIDで置き換えるヘルパーのカスタム使用を示しています。フォームが送信されると、デフォルトのモデルバインダはビューモデルを適切にバインドできます。