Jak renderować widok częściowy w MVC3

Question

Próbuję wyrenderować częściowy widok w mojej aplikacji i nie mogę wyświetlić wartości. Oto, jak wygląda mój widok.

mój główny Główna Zobacz

<div id="RPPricingNameModel"> 
    @Html.Partial("RPPricingPlanNames") 
</div> 
<script type="text/javascript"> 
    $("#RPPricingNameModel").load("/Home/GetPlanNameModel");  
</script> 

Częściowy widok

@model PlanNameModel  
<table style= "vertical-align:top; left:0px; top:0px; position:absolute; border-width:1px; border-style:solid; border-color:Green; width:130px; text-align:left;">  
    <tr> 
     <td style=" font-size:15px; font-weight:bold; color:Black;">    
      @Model.Header 
      <div>    
        @Html.LabelFor(x => x.Header)    
      </div> 
     </td> 
    </tr> 
<table> 

Oto kontroler, który zwraca się widokiem.

public ActionResult GetPlanNameModel() 
{ 
    PlanNameModel planNameModel = new PlanNameModel(); 
    planNameModel.Header = "Plans"; 
    //return View(planNameModel); 
    return PartialView(planNameModel); 
} 

Oto kod dla modelu

public class RPPricingPlanNameModel 
{ 
    public string Header { get; set; } 
} 

Kiedy próbuję wyświetlić wartość w TD, nie pokazuje nic. Czy możesz mi pomóc z tym?

Answer 1

Jeśli wszystko próbują zrobić to użyć partialViews i nie specjalnie załadować je dynamicznie z jQuery, proszę spojrzeć na moją odpowiedź na to pytanie, a powinien on prawdopodobnie rozwiązać problem:

MVC3 Partial Views

Wszystko co musisz zrobić, to stworzyć ViewModel dla indeksu, który zawiera wszystkie obiekty, które swoją częściowy widok (s) muszą

Controller ActionMethod:

public ActionResult Index() 
{ 
    PlanNameModel planNameModel = new PlanNameModel(); 
    planNameModel.Header = "Plans"; 
    ViewData.Model = new IndexVm{ PlanNameModel = planNameModel }; 
} 

ViewModel:

public class IndexVm 
    { 
    public PlanNameModel PlanNameModel { get; set; } 
    } 

Główna Zobacz

@model IndexVm 

@*Whatever index code you have*@ 

@Html.Partial("PlanPartial", Model.PlanNameModel) 

Częściowa Wyświetl

@model PlanNameModel 

<div>@Model.Header</div> 

Answer 2

wygląda brakuje selektor szukasz w selektorze jquery

trzeba dodać:

<div id="RPPricingNameModel"></div> 

do DOM

także swoimi @ m.Header powinien być @Model.Nagłówek

i wreszcie JavaScript, aby załadować częściowy widok nie powinien być w Twój częściowy widok, należy na głównym widoku, który chcesz załadować częściowy wgląd

Answer 3

zastąpić indeks z:

<div id="RPPricingNameModel"></div> 

<script type="text/javascript"> 
    $(function(){$("#RPPricingNameModel").load("/Home/GetPlanNameModel");}); 
</script> 

null odniesienia jest spowodowane początkowym połączenie do częściowego przez

@Html.Partial("RPPricingPlanNames") 

bez wymaganego modelu

Answer 4

zawinąć $("#RPPricingNameModel").load("/Home/GetPlanNameModel"); wewnątrz dokumentu gotowego tak, że zostanie wykonany dopiero po całkowitym dom jest załadowany

$(function(){ 

$("#RPPricingNameModel").load("/Home/GetPlanNameModel"); 

});