Render PartialView utilisant ajax après l'article de sélection dropdownlist

Question

Je les suivantes ViewModel

public class ReservationDetails 
    { 
     public ReservationDetails() 
     { 

     } 
     public Reservation Reservation { get; set; } 

     public List<ReservationHouseDetails> ReservationHouseDetails { get; set; } 

     public Dictionary<string,ReservationHouseDetails> MyProperty { get; set; } 

     public List<ReservationAttractionDetails> ReservationAttractionDetails { get; set; } 

     public IEnumerable<SelectListItem> Houses { get; set; } 

     public int SelectedHouseDetailsId { get; set; } 

     public string SelectedHouseDetailsText { get; set; } 
    } 

Quand j'ouvrir la vue Details.cshtml il me affiche DROPDOWNLIST avec le nom de maisons. Je voudrais sélectionner l'un d'eux et après l'affichage du bouton de clic dans le contenu de la vue partielle dans certains div de la maison sélectionnée. Comment dois-je corriger le script follwing pour rendre une vue partielle en utilisant ajax

<script type="text/javascript"> 
     $('.SelectHouse').click(function() { 
    $('.divForSelectHouse').Load('@Html.Partial("~/Views/ClientReservations/ReservationHouseDetails.cshtml",Model.MyProperty[Model.SelectedHouseDetailsText])') 
}); 
    </script> 

Je pense que ce devrait être la méthode supplémentaire dans le contrôleur, resposible pour afficher une vue partielle comme celui-ci

public PartialViewResult DetailsHouse(ReservationHouseDetails houseDetails) 
     { 
      return PartialView("ReservationHouseDetails", houseDetails); 
     } 

Dans ce cas, comment puis-je passer un objet en paramètre à cette méthode, s'il doit être sérialisé, à quoi cela devrait-il ressembler?

Answer 1

@Html.Partial() est la méthode côté serveur, elle sera appelée avant le rendu HTML. Dans votre cas, vous devez lier une vue partielle en fonction de la sélection de la liste déroulante. Donc, ce que vous devez faire est, vous devez appeler la méthode de contrôleur de la vue partielle par ajax.

$('.SelectHouse').click(function() { 

$.ajax({ url: @Uri.Action("ActionName","ControllerNmae"), 
      type: "post", 
      dataType:"html", 
      data: "<your data as serialized json>", 
      success: function(result) { 
       $('.divForSelectHouse').html(result); 
      } 
     }); 
});