web-dev-qa-db-fra.com

Fenêtres pop-up MVC

J'ai besoin de créer des fenêtres pop-up en mvc (pas un nouvel onglet dans le navigateur). Est-ce que quelqu'un sait comment faire ça?

asp.net-mvcpopup
11
Cipiripi

Une possibilité consiste à utiliser boîte de dialogue jquery ui .

[~ # ~] modifier [~ # ~]

L'idée serait d'avoir une action ajax qui retourne une vue partielle. Le résultat de cette action (html) est placé à l'intérieur du conteneur du popup et sur le gestionnaire de succès de l'appel ajax vous ouvrez le popup. Voici un exemple de code:

@Ajax.ActionLink("Open popup", "SomeAction", new AjaxOptions { HttpMethod = "GET", UpdateTargetId = "result", InsertionMode = InsertionMode.Replace, OnSuccess="openPopup" })<br />

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

<script type="text/javascript">
$(document).ready(function() {
    $("#result").dialog({
        autoOpen: false,
        title: 'Title',
        width: 500,
        height: 'auto',
        modal: true
    });
});
function openPopup() {
    $("#result").dialog("open");
}
</script>

Ensuite, vous devez ajouter l'action dans le contrôleur qui renvoie la vue partielle

 [HttpGet]
 public PartialViewResult SomeAction()
 {
      return PartialView();
 }

Placez tout ce dont vous avez besoin dans la vue partielle, vous pouvez également inclure des paramètres dans l'action, etc.

Bonne chance!

37
uvita

La manière la plus évidente est d'utiliser l'un des frameworks js. Personnellement, je préfère le contrôle de la boîte de dialogue jQuery UI.
Veuillez vérifier http://jqueryui.com/demos/dialog/ pour des informations détaillées à ce sujet.
Vous pouvez également vérifier meilleure pratique de dialogue/popup modal ASP.NET MVC (c'est une question similaire à la vôtre)

Bien sûr, si vous avez besoin d'une fenêtre contextuelle simple, vous pouvez toujours utiliser alert('Im popup');

Mettre à jour en fonction de votre dernière demande
Pour ouvrir une URL dans une nouvelle fenêtre, vous pouvez utiliser le javascript suivant:

function OpenDialog() {
window.open("some url", "DialogName", "height=200,width=200,modal=yes,alwaysRaised=yes");
}

Mais le résultat dépend vraiment du navigateur. La plupart d'entre eux ouvrent cette fenêtre modale non pas dans un nouvel onglet mais dans une nouvelle instance de navigateur.
Ce sujet pourrait également vous aider:
JavaScript s'ouvre dans une nouvelle fenêtre, pas un onglet

3
Igor V Savchenko