MVC 3:如何在通过 ajax 加载时呈现没有布局页面的视图? [英] MVC 3: How to render a view without its layout page when loaded via ajax?

问题描述

我正在学习渐进增强，我有一个关于 AJAXifying 视图的问题.在我的 MVC 3 项目中，我有一个布局页面、一个 viewstart 页面和两个普通视图.

I am learning about Progressive Enhancement and I have a question about AJAXifying views. In my MVC 3 project I have a layout page, a viewstart page, and two plain views.

viewstart 页面位于 Views 文件夹的根目录中，因此适用于所有视图.它指定所有视图都应将 _Layout.cshtml 用于其布局页面.布局页面包含两个导航链接，每个视图一个.链接使用 @Html.ActionLink() 将自身呈现到页面上.

The viewstart page is in the root of the Views folder and thus applies to all views. It specifies that all views should use _Layout.cshtml for their layout page. The layout page contains two navigation links, one for each view. The links use @Html.ActionLink() to render themselves to the page.

现在我已经添加了 jQuery 并且想要劫持这些链接并使用 Ajax 在页面上动态加载它们的内容.

Now I have added jQuery and want to hijack these links and use Ajax to load their content on the page dynamically.

<script type="text/javascript">
    $(function () {
        $('#theLink').click(function () {
            $.ajax({
                url: $(this).attr('href'),
                type: "GET",
                success: function (response) {
                    $('#mainContent').html(response);
                }
            });
            return false;
        });
    });
</script>

我能想到两种方法来做到这一点，但我并不特别喜欢任何一种:

There are two ways I can think of to do this, but I don't particularly like either one:

1) 我可以获取整个 View 的内容并将它们放在局部视图中，然后让主视图在呈现时调用局部视图.这样，在控制器中使用 Request.IsAjaxRequest()，我可以根据是否返回 View() 或返回 PartialView()该请求是一个 Ajax 请求.我无法将常规视图返回给 Ajax 请求，因为它会使用布局页面，并且我会注入布局页面的第二个副本.但是，我不喜欢这样，因为它迫使我为标准 GET 请求创建只有一个 @{Html.RenderPartial();} 的空视图.

1) I can take the entire View's contents and place them in a partial view, then have the main view call the partial view when it is rendered. That way, using Request.IsAjaxRequest() in the controller, I can return View() or return PartialView() based on whether or not the request is an Ajax request. I can't return the regular view to the Ajax request because then it would use the layout page and I'd get a second copy of the layout page injected. However, I don't like this because it forces me to create empty views with just a @{Html.RenderPartial();} in them for the standard GET requests.

    public ActionResult Index()
    {
        if (Request.IsAjaxRequest())
            return PartialView("partialView");
        else
            return View();
    }

然后在 Index.cshtml 中这样做:

Then in Index.cshtml do this:

@{Html.RenderPartial("partialView");}

2) 当请求不是 Ajax 时，我可以从 _viewstart 中删除布局指定并手动指定它:

2) I can remove the layout designation from _viewstart and specify it manually when the request is NOT Ajax:

    public ActionResult Index()
    {
        if (Request.IsAjaxRequest())
            return View(); // Return view with no master.
        else
            return View("Index", "_Layout"); // Return view with master.
    }

有人有更好的建议吗?有没有办法在没有布局页面的情况下返回视图?如果它是一个 ajax 请求，那么明确地说不包含您的布局"会比如果它不是一个 ajax 请求时明确地包含布局要容易得多.

Does anyone have a better suggestion? Is there a way to return a view without its layout page? It would be much easier to explicitly say "don't include your layout" if it is an ajax request, than it would be to explicitly include the layout if it's not an ajax.

推荐答案

在~/Views/ViewStart.cshtml中:

@{
    Layout = Request.IsAjaxRequest() ? null : "~/Views/Shared/_Layout.cshtml";
}

在控制器中:

public ActionResult Index()
{
    return View();
}

这篇关于MVC 3:如何在通过 ajax 加载时呈现没有布局页面的视图?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！