2011-01-26 17 views
12

Potrzebuję stworzyć wyskakujące okna w mvc (nie nowa karta w przeglądarce). Czy ktoś wie, jak to zrobić?MVC-pop up window

+0

zaktualizowałem moją odpowiedź w zależności od aktualnych wymagań (adres URL w otwartym oknie). Mam nadzieję, że to ci pomoże :) –

Odpowiedz

34

Jedną z możliwości jest użycie jquery ui dialog.

EDIT

Pomysł byłoby mieć działanie ajax zwracającą częściowy widok. Wynik tej akcji (html) umieszczany jest wewnątrz kontenera popup i na module obsługi wywołania ajax wywołujesz wyskakujące okienko. Oto przykładowy kod:

@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> 

Następnie trzeba dodać akcję w kontrolerze, który zwraca częściowy widok

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

miejsce co trzeba w częściowym widokiem, można także parametry akcja, itp.

Powodzenia!

+0

Potrzebuję podać adres url, który zostanie otwarty w modowym pop-up, i nie jestem pewien, jak to zrobić z jquery .. Any idea? – Cipiripi

+0

Edytowałem swoją odpowiedź, proszę to sprawdzić. – uvita

+0

Otwiera tylko niektóre div jako treść okna, prawda? Ale jak otworzyć inną stronę w oknie dialogowym? –

3

Najbardziej oczywistym sposobem jest użycie jednego z frameworków js. Osobiście preferuję kontrolę okna dialogowego jQuery UI.
Proszę sprawdzić http://jqueryui.com/demos/dialog/ w celu uzyskania szczegółowych informacji na ten temat.
Ponadto można sprawdzić ASP.NET MVC modal dialog/popup best practice (to pytanie podobne do Ciebie)

Oczywiście jeśli potrzebujesz prostego okienko zawsze może użyć alert('Im popup');

Aktualizacja według swojej najnowszej życzenie
Aby otworzyć jakiś link w nowym możesz użyć następnego javascript:

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

Jednak wynik naprawdę zależy od przeglądarki. Większość z nich otwiera to modalne okno, nie w nowej karcie, ale w nowej instancji przeglądarki.
Ten temat może pomóc aswell:
JavaScript open in a new window, not tab