Comment afficher la vue ASP.NET MVC 3 sous forme de popup - jquery, asp.net-mvc

Je dois afficher une vue complète (.cshtml page Web) en tant que fenêtre contextuelle dans ASP.NET MVC 3. Actuellement, la page Web destinée à devenir une fenêtre contextuelle est contrôlée par le contrôleur MVC et se comporte comme une autre vue. La page Web contextuelle s'affiche lorsqu'un clic sur un bouton provient d'une autre page Web .cshtml et je ne voudrais pas quitter la vue d'origine lorsque l'utilisateur clique sur le bouton. Je songe à utiliser jquery.show () pour faire apparaître la vue sous forme de fenêtre contextuelle, bien que cela ne soit pas obligatoire. Quels changements dois-je faire?

Réponses:

Faites un appel jquery ajax comme ceci:

      $.ajax({
url: /myController/Popup,
type: "GET",
data: id,
success: function (result) {
$("#myTag").html(result);
}
});

Ensuite, dans le contrôleur, retournez une vue partielle, comme ceci:

   public ActionResult Popup(int id)
{

/* construct the viewmodel */
myViewModel = ....
.
return PartialView("MyPartialView", myViewModel);
}

Cette vue partielle sera ensuite ajoutée à myTag.

Faites un appel ajax à l'URL de l'action, quelque chose comme ...

$.ajax({
url: "@Url.Action("youractionname")"
,type: "POST"
,data: data
,success: function(response)
{
$(document).append("<div class="popup">" + response + "</div>");
}
});

De toute évidence, votre code HTML devra peut-être être ajusté un peu, peut-être un div modal pour bloquer l’accès à la page ci-dessous, et .popup devra être défini pour le faire apparaître sous forme de popup.

Une façon d'y parvenir est d'utiliser http://fancybox.net/ et chargez simplement la nouvelle page Web en tant qu’iframe dans la boîte fantaisie. Consultez les exemples de fancybox en bas.

jQuery.show () n'a rien à voir avec la création de popups. Il est utilisé pour masquer / afficher des éléments dans le DOM.