Wie aktualisiere ich das Ansichtsmodell in einer Teilansicht in MVC5?

Question

Ich habe eine Ansicht und in dieser Ansicht habe ich ein Div, das eine Teilansicht enthalten wird.

Mein Problem ist dies. Der Benutzer wählt ein Element aus der Dropdown-Liste und ich lade die Teilansicht mit dem Modell. Die Benutzeränderung ändert einige der Textfelder und klickt auf die Schaltfläche, um die Teilansicht (die sich in einem Html.BeginForm befindet) zu senden.

Wenn ich gehe, um das Modell in der Steuerung zu untersuchen, enthält das Modell nicht die Änderungen, die der Benutzer vorgenommen hat.

Warum spiegelt das Modell nicht die Änderungen wider, die der Benutzer vorgenommen hat?

in der Hauptansicht:

<div id="personInfo" style="display:none;"></div> 

Meine Teilansicht:

@model MyProject.MyModel 

    @(Html.Kendo().DropDownList().Name("ddlFilters") 
           .AutoBind(true) 
           .OptionLabel("--- Select Filter ---") 
           .DataValueField("ID") 
           .DataTextField("MYFILTER") 
           .DataSource(ds => 
            ds.Read(r => r.Action("GetPersonFilters", "Home")) 
           ) 
           .Events(x => x.Select("ddlFilters_onSelect")) 
         ) 

    @using (Html.BeginForm("PersonAction", "Home", FormMethod.Post, new { @class = "form-horizontal", id = "personForm" })) 
      { 
       // Strongly typed Kendo fields. Several DropDownListFor and TextBoxFor 
       @Html.Kendo().TextBoxFor(x => x.FirstName).HtmlAttributes(new { @class = "form-control kendoTextBox required " }) 
       // Button to post the form data to the controller. 
      } 

Mein Javascript:

function ddlFilters_onSelect(e) { 
    var itm = this.dataItem(e.item); 

    clearForm(); 

    if (itm.ID > 0) { 
     // Ajax call to get data.... 
     $.ajax({ 
      url: "/Home/GetPerson", 
      type: "GET", 
      data: { "myID": itm.ID } 
     }) 
     .done(function (result) { 
      //var aaa = data;  
      $("#personInfo").html(result); 
     }) 
     .fail(function (xhr, status, err) { 
      alert(xhr.responseText); 
     }); 
    } 
}; 

Modell:

public partial class MyModel 
    { 
     public decimal ID { get; set; } 
     public string FirstName{ get; set; } 
     public string LastName{ get; set; } 
     public string MiddleName{ get; set; } 
    } 

EDIT: Controller-Code:

// Initial call to main view 
    public ActionResult CreateNewPerson() 
    { 
     return View(); 
    } 

    // Call to load Partial View initially 
    public PartialViewResult GetPersonInfo() 
    { 
     return PartialView("_PersonForm", new MyModel()); 
    } 

    // Call to load partial view with data 
    public PartialViewResult GetPerson(int myID) 
    { 
     myData = GetFromDB(myID); 
     return PartialView("_PersonForm", myData); 
    } 

    // Method to save partial form 
    [HttpPost] 
    public ActionResult PersonAction(MyModel filter) 
    {   

     if (ModelState.IsValid) 
     { 
      // Go update DB 
     } 

     return View("CreateNewPerson"); 
    } 

Answer 1

Dies ist nicht genau das Szenario, das Sie beschrieben, aber das ist, wie mein Team nutzt partials:

1) Im Ansichtsmodell für Ihre Hauptansicht, Objekte hinzufügen (z.B MyModel) für das Modell der Teilansicht.

2) Wenn die Teilansicht in cshtml aufrufen, stellen Sie sicher, dass Sie MVC sagen, wo der Inhalt der Teilansicht zu binden:

@Html.Partial("_PersonAction", Model.MyModel, new ViewDataDictionary(Html.ViewData) { 
     TemplateInfo = new TemplateInfo { HtmlFieldPrefix = Html.NameFor(m => m.MyModel).ToString() } 
    }) 

Hinweis, wie wir die TemplateInfo verwenden Sie den richtigen Kontext für die festlegen partiell, so dass den Eingaben, die in der partiellen Darstellung gerendert werden, die korrekten Namen vorangestellt werden, damit die Modellbindung funktioniert. Z.B. <input name="MyModel.FirstName"> Sie können dies wahrscheinlich in Javascript fälschen, aber frag mich nicht wie.

3) Unsere Controller-Aktionen akzeptieren das ViewModel der Hauptseite. Die <form> ist auf der Hauptseite und umgibt den Teilanruf.