ASP.NET MVC3でAjaxメモ - かずきのBlog@hatena

_Layout.cshtmlでjquery.unobtrusive-ajax.min.jsをscriptタグで読み込むようにする

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title</title>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
</head>

<body>
    @RenderBody()
</body>
</html>

コントローラにAjax用のアクションを用意する。

[HttpPost]
public ActionResult MyAjaxAction()
{
    if (Request.IsAjaxRequest())
    {
        // Ajaxのとき。必要に応じて引数にModelを渡せる
        return PartialView();
    }
    // Ajaxじゃないとき
    return new EmptyResult();
}

AjaxのアクションのViewを用意する。命名規則は普通のViewと同じで、コントローラ名のフォルダにアクションの名前のcshtmlを作る。

<p>@DateTime.Now.ToString("yyyy/MM/dd HH:mm:ss")</p>

Ajax用のアクションを呼び出すリンクを作る

<!-- HomeコントローラのRoleInstanceNamesアクションを呼ぶ -->
@Ajax.ActionLink("手動リロード", "MyAjaxAction", null, new AjaxOptions
    {
        // 結果を流し込む所のid
        UpdateTargetId = "result",
        // HTTP Method
        HttpMethod = "Post",
        // 流し込み方。置き換えや前に差し込むや後ろに差し込む等から選ぶ
        InsertionMode = InsertionMode.InsertBefore
    }, 
    // 生成されるリンクのHTMLの属性
    new { id = "actionLink" })
<div id="result">
</div>

という感じの備忘録メモ。