ビューの中に部分ビューを読み込むには？

質問

この部分表示で非常に困っています。

メインビューの中に部分ビューをロードしたいのですが、どうすればよいでしょうか？

以下は簡単な例です。

メインページとしてHomecontroller IndexアクションのIndex.cshtmlを読み込んでいます。

index.cshtmlに、以下の方法でリンクを作成しています。

@Html.ActionLink("load partial view","Load","Home")

という新しいActionをHomeControllerに追加しています。

public PartialViewResult Load()
{
    return PartialView("_LoadView");
}

を_LoadView.cshmtlの中に入れているだけです。

<div>
    Welcome !!
</div>

しかし、プロジェクトを実行すると、index.cshtml が最初にレンダリングされ、"Load Partial View" というリンクが表示されます。これをクリックすると新しいページに移動し、 _LoadView.cshtml から index.cshtml にウェルカムメッセージがレンダリングされなくなります。

何が間違っているのでしょうか？

注：AJAXでページをロードしたくない、またはAjax.ActionLinkを使いたくない。

どのように解決するのですか？

メインビューの内部で部分ビューを直接ロードしたい場合は Html.Action ヘルパーを使います。

@Html.Action("Load", "Home")

または、Loadアクションを経由したくない場合は、HtmlPartialAsyncヘルパーを使用してください。

@await Html.PartialAsync("_LoadView")

を使いたい場合は Ajax.ActionLink を使いたい場合は Html.ActionLink に置き換えてください。

@Ajax.ActionLink(
    "load partial view", 
    "Load", 
    "Home", 
    new AjaxOptions { UpdateTargetId = "result" }
)

そしてもちろん、パーシャルが表示されるページにはホルダーを含める必要があります。

<div id="result"></div>

も忘れずに入れましょう。

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>

を有効にするために、メインビューで Ajax.* ヘルパーを有効にするためです。そして、web.configでunobtrusive javascriptが有効になっていることを確認してください（デフォルトで有効になっているはずです）。

<add key="UnobtrusiveJavaScriptEnabled" value="true" />