0

Views Shared_Layout.cshtml で共有ビューを使用した mvc3 Web アプリがあります。

_Layout.cshtml には、アプリのマスター ページのように機能するマークアップが含まれています。

@using .............
@using ......

<!DOCTYPE html>
<html style="overflow: hidden">
    <head>
        <title>@ViewBag.Title</title>

        <link href="@Url.Content("~/Content/Site.min.css")" rel="stylesheet" type="text/css" />
        <link href="@Url.Content("~/Content/themes/metro-light/jquery-ui-1.8.16.custom.css")" rel="stylesheet" type="text/css" />
        @RenderSection("CSS", false)
        <script src="@Url.Content("~/Scripts/jquery-1.6.2.min.js")" type="text/javascript"> </script>
        <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"> </script>
        <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"> </script>
        <script src="@Url.Content("~/Scripts/jquery-ui-1.8.16.custom.min.js")" type="text/javascript"> </script>
        <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"> </script>
        ...... (some other scripts here)
        ......

    </head>
    <body style="height: 100%">
        <!-- page -->
        <div class="page">
            <div id="header">
                <div id="title">
                    <img alt="" src="@Url.Content("~/Content/images/Logo.png")"/>@ViewBag.ApplicationName
                </div>
                <div id="logindisplay">
                    Welcome <strong>@User.Identity.Name</strong>
                </div>
                <ul id="menu">              
                    <li>@Ajax.ActionLink("Dashboard", "Index","Dashboard", new {@class = "Map View".Equals(ViewBag.Title) ? "selected" : null},new AjaxOptions { UpdateTargetId = "main", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" })</li>
                    <li>@Ajax.ActionLink("Map View", "Index", "Map", new { @class = "Map View".Equals(ViewBag.Title) ? "selected" : null },new AjaxOptions { UpdateTargetId = "main", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" })</li>
                    <li>@Ajax.ActionLink("Settings", "Index", "Settings", new { @class = "Settings".Equals(ViewBag.Title) ? "selected" : null }, new AjaxOptions { UpdateTargetId = "main", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" })</li>
                    <li>@Ajax.ActionLink("About", "Index", "AppInfo", new { @class = "About".Equals(ViewBag.Title) ? "selected" : null }, new AjaxOptions { UpdateTargetId = "main", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" })</li>
                </ul>
            </div>
            <div id="main">
                @RenderBody()
            </div>
        </div>
        <!-- footer -->
        <div id="footer">

        </div>
        <form id="__ajaxAntiForgeryForm" action="#" method="post">@Html.AntiForgeryToken()</form>
    </body> 

</html>

基本的に、上記のコードから、「メイン」divをコントローラーが返すものに置き換えています

new AjaxOptions { UpdateTargetId = "main", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" }

これが私のコントローラーです(特別なものはありません)

ダッシュボードコントローラー

[UiException]
public ActionResult Index()
{
    return View();
}

マップコントローラー

[UiExceptionAttribute]
public ActionResult Index()
{
return View();
}

ページを読み込んで「ダッシュボード」または「マップ ビュー」のリンクをクリックすると、ページ全体がちらつき、更新されます。@Ajax.ActionLink はページ全体を更新するのではなく、「メイン」の div のみを更新します。コンテンツ セクションのみをリフレッシュする ajax のような動作をさせる方法はありますか? 誰でも助けることができますか?ありがとう!

4

3 に答える 3

1

これは、マスターページ全体 (つまり、レイアウト) を含むコントローラー コードからビュー全体を返しているためです。

ダッシュボードまたはマップの部分的なビューのみをレンダリングする必要があります。お気に入り:

ダッシュボードコントローラー

[UiException]
public ActionResult Index()
{
return  PartialView("yourviewname",model)
}


protected string RenderPartialViewToString(string viewName, object model)
    {
        if (string.IsNullOrEmpty(viewName))
            viewName = ControllerContext.RouteData.GetRequiredString("action");

        ViewData.Model = model;

        using (StringWriter sw = new StringWriter())
        {
            ViewEngineResult viewResult = ViewEngines.Engines.FindPartialView(ControllerContext, viewName);
            ViewContext viewContext = new ViewContext(ControllerContext, viewResult.View, ViewData, TempData, sw);
            viewResult.View.Render(viewContext, sw);
            return sw.GetStringBuilder().ToString();
        }
    }
于 2012-10-23T07:57:23.070 に答える
0

控えめな Javascript インクルードが欠落しているため、イベント ハンドラーがアタッチされていないため、アクション リンクは実際には「実際の」ajax リンクではありません (控えめな ajax スクリプトは基本的に、属性 data-ajax=true を持つすべてのリンクを検索し、それにメソッドをアタッチします) ajaxのことをするために)。

そのため、ファイルも含めるjquery.unobtrusive-ajax.min.jsと、期待どおりに機能するはずです。

于 2012-10-23T02:23:01.580 に答える
0

上記のように、これも便利だと思いました.._Sharedフォルダーにビューを配置せずに。

/// <summary>
/// Dynamically Render a View using the passed-in context
/// </summary>
/// <param name="controllerContext"></param>
/// <param name="viewName"></param>
/// <param name="model"></param>
/// <returns></returns>
public static string RenderView(ControllerContext controllerContext, string viewName, object model)
{
    controllerContext.Controller.ViewData.Model = model;
    using (var sw = new StringWriter())
    {
        var viewResult = ViewEngines.Engines.FindPartialView(controllerContext, viewName);
        var viewContext = new ViewContext(controllerContext, viewResult.View, controllerContext.Controller.ViewData, controllerContext.Controller.TempData, sw);
        viewResult.View.Render(viewContext, sw);
        viewResult.ViewEngine.ReleaseView(controllerContext, viewResult.View);
        return sw.GetStringBuilder().ToString();
    }
}
于 2012-10-24T09:02:27.017 に答える