如何将ASP.NET MVC 3视图显示为弹出窗口

Question

我需要在ASP.NET MVC 3中将一个完整的视图(.cshtml网页)以弹出窗口的形式显示出来。目前控制成为弹出窗口的网页由MVC控制器控制，并作为另一个视图行为。当从另一个.cshtml网页点击按钮时，弹出窗口将显示，而我不希望在单击按钮时退出原始视图。我考虑使用jquery.show()将视图变成弹出窗口，但这不是必需的。我需要进行哪些更改？

- Peter K

---

这里有一篇关于如何使用jQuery在ASP.NET MVC 3中创建模态弹出窗口的整洁文章... - Yasser Shaikh

Answer 1

像这样进行jQuery ajax调用：

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

然后在控制器中只需返回一个局部视图，类似于这样：

   public ActionResult Popup(int id)
    {

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

这个部分视图将会被添加到 myTag 中。

- zszep

Answer 2

发起一个 ajax 请求到 action 的 url，类似于...

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

显然，您的HTML可能需要进行一些调整，可能需要一个模态div来阻止访问下面的页面，并且.popup将需要定义为使其显示为弹出窗口。

- Chris Carew

Answer 3

实现这个的一种方法是使用http://fancybox.net/，并将新网页作为iframe加载到fancybox中。在底部检查fancybox示例。

jQuery.show()与创建弹出窗口无关。它用于隐藏/显示DOM中的元素。

- Simon Edström