Como exibir a visualização da ASP.NET MVC 3 como um pop-up - jquery, asp.net-mvc

Eu preciso mostrar uma visão completa (.cshtml webpage) como um pop-up no ASP.NET MVC 3. Atualmente, a página da Web para se tornar um popup é controlada pelo controlador MVC e se comporta como outra exibição. A página pop-up será exibida quando um botão for clicado de outra página da Web .cshtml e eu não gostaria de sair da visualização de origem quando o botão for clicado. Estou pensando em usar o jquery.show () para fazer a exibição como um pop-up, embora isso não seja um requisito. Quais mudanças eu preciso fazer?

Respostas:

Faça uma chamada jquery ajax assim:

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

Então, no controlador, basta retornar uma visão parcial, algo assim:

   public ActionResult Popup(int id)
{

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

Esta vista parcial será então adicionada à myTag.

Faça uma chamada ajax para o url da ação, algo como ...

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

Obviamente, o seu html pode precisar ser ajustado um pouco, talvez um div modal para bloquear o acesso à página abaixo, e o .popup precisará ser definido para que ele apareça como um popup.

Uma maneira de conseguir isso é usar http://fancybox.net/ e basta carregar a nova página da web como um iframe dentro do fancybox. Verifique em exemplos de caixa de fantasia na parte inferior.

jQuery.show () não tem nada a ver com a criação de pop-ups. É usado para ocultar / mostrar elementos no DOM.