MVC 3: Як візуалізувати подання без його макетної сторінки при завантаженні через ajax?

Я дізнаюся про « Прогресивне вдосконалення», і у мене виникає питання про AJAXifying погляди. У моєму проекті MVC 3 у мене є сторінка з макетом, сторінка перегляду та два простих подання.

Сторінка перегляду знаходиться в корені папки «Перегляди» і, таким чином, застосовується до всіх представлень даних. Він визначає, що всі перегляди повинні використовуватись _Layout.cshtmlдля своєї сторінки макета. Сторінка макета містить два посилання навігації, по одному для кожного перегляду. Посилання використовуються @Html.ActionLink()для відображення сторінки.

Тепер я додав jQuery і хочу викрасти ці посилання та використовувати Ajax для динамічного завантаження їх вмісту на сторінку.

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

Я можу зробити це двома способами, але жоден із них мені не подобається особливо:

1) Я можу взяти весь вміст Перегляду та розмістити їх у частковому перегляді, а потім матимуть головний вигляд викликати частковий вигляд, коли він відображається. Таким чином, використовуючи Request.IsAjaxRequest()в контролері, я можу повернутися View()або повернутися PartialView()на основі того, чи є запит Ajax-запитом. Я не можу повернути звичайний вигляд до запиту Ajax, оскільки тоді він використовував би макет сторінки, і я отримаю другу копію сторінки макета. Однак мені це не подобається, тому що це змушує мене створювати порожні представлення з просто @{Html.RenderPartial();}в них для стандартних GET-запитів.

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

Потім у Index.cshtml зробіть це:

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

2) Я можу видалити позначення макета з _viewstart і вказати його вручну, коли запит НЕ 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.

В ~/Views/ViewStart.cshtml:

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

і в контролері:

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

Просто поставте наступний код у верхній частині сторінки

@{
    Layout = "";
}

Я віддаю перевагу і використовую ваш варіант №1. Мені не подобається №2, тому що для мене View()означає, що ти повертаєш всю сторінку. Це має бути повністю розробленою та дійсною HTML-сторінкою після того, як механізм перегляду буде виконаний з нею. PartialView()створено для повернення довільних фрагментів HTML.

Я не думаю, що бачити, що просто називається частковою, не дуже важливо. Він досі сухий, і дозволяє використовувати логіку часткового у двох сценаріях.

Багатьом людям не подобається фрагментація шляхів виклику їх дії Request.IsAjaxRequest(), і я можу це оцінити. Але ІМО, якщо все, що ви робите, - це вирішити питання про те, чи зателефонувати View()чи PartialView()тоді відділення - це не велика справа і його легко підтримувати (і тестувати). Якщо ви виявите, що використовуєте IsAjaxRequest()для визначення великих частин того, як відбувається ваша дія, то, можливо, зробити окрему дію AJAX, ймовірно, краще.

Створіть дві верстки: 1. порожній макет, 2. основний макет, а потім запишіть у файл _viewStart цей код:

@{
if (Request.IsAjaxRequest())
{
    Layout = "~/Areas/Dashboard/Views/Shared/_emptyLayout.cshtml";
}
else
{
    Layout = "~/Areas/Dashboard/Views/Shared/_Layout.cshtml";
}}

звичайно, можливо, це не найкраще рішення

Для цього не потрібно створювати порожній вигляд.

У контролері:

if (Request.IsAjaxRequest())
  return PartialView();
else
  return View();

повернення PartialViewResult замінить визначення макета під час надання відповіді.

З ASP.NET 5 вже не доступна змінна Запит. Ви можете отримати доступ до нього зараз за допомогою Context.Request

Також методу IsAjaxRequest () більше немає, його потрібно написати самостійно, наприклад у розширеннях \ HttpRequestExtensions.cs

using System;
using Microsoft.AspNetCore.Http;

namespace Microsoft.AspNetCore.Mvc
{
    public static class HttpRequestExtensions
    {
        public static bool IsAjaxRequest(this HttpRequest request)
        {
            if (request == null)
            {
                throw new ArgumentNullException(nameof(request));
            }

            return (request.Headers != null) && (request.Headers["X-Requested-With"] == "XMLHttpRequest");
        }
    }
}

Я деякий час шукав це і сподіваюся, що допоможе і іншим;)

Ресурс: https://github.com/aspnet/AspNetCore/isissue/2729

Для програми Ruby on Rails мені вдалося запобігти завантаженню макета, вказавши render layout: falseв дії контролера, що я хочу відповісти html-файлом ajax.