MVC 3: Ajax 経由でロードされたときにレイアウト ページなしでビューをレンダリングする方法は? 質問する

MVC 3: Ajax 経由でロードされたときにレイアウト ページなしでビューをレンダリングする方法は? 質問する

私は学んでいますプログレッシブエンハンスメントビューの AJAX 化について質問があります。私の MVC 3 プロジェクトには、レイアウト ページ、ビュー スタート ページ、および 2 つのプレーン ビューがあります。

viewstart ページは Views フォルダーのルートにあり、すべてのビューに適用されます。すべてのビューが_Layout.cshtmlレイアウト ページに使用することを指定します。レイアウト ページには、各ビューに 1 つずつ、合計 2 つのナビゲーション リンクが含まれています。リンクは、@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>

これを行うには 2 つの方法が考えられますが、どちらも特に気に入っていません。

1) ビューのコンテンツ全体を部分ビューに配置し、レンダリング時にメイン ビューで部分ビューを呼び出すことができます。このように、Request.IsAjaxRequest()コントローラーで を使用して、リクエストが Ajax リクエストであるかどうかに基づいて、 を返すView()か、 を返すことPartialView()ができます。通常のビューを Ajax リクエストに返すことはできません。そうすると、レイアウト ページが使用され、レイアウト ページの 2 番目のコピーが挿入されるためです。ただし、これは@{Html.RenderPartial();}標準の GET リクエストに対してだけを含む空のビューを作成する必要があるため、好きではありません。

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

次に、Index.cshtml で次の操作を実行します。

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

2) リクエストが Ajax でない場合は、_viewstart からレイアウト指定を削除して手動で指定できます。

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

もっと良い提案はありますか? レイアウト ページなしでビューを返す方法はありますか? Ajax リクエストの場合は「レイアウトを含めないでください」と明示的に指示する方が、Ajax でない場合レイアウトを明示的に含めるよりもはるかに簡単です。

ベストアンサー1

~/Views/ViewStart.cshtml

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

コントローラーでは:

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

おすすめ記事