0

我有一个 mvc3 Web 应用程序我在 Views Shared_Layout.cshtml 下使用了一个共享视图

_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

如上所述，我发现这也很有用.. 没有将视图放在 _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 回答
0

您的不显眼的 Javascript 包含丢失，因此操作链接实际上不是“真正的”ajax 链接，因为没有附加事件处理程序（unobtrusive-ajax 脚本基本上查找具有属性 data-ajax=true 的所有链接并将方法附加到它做ajax的东西）。

所以也包括该jquery.unobtrusive-ajax.min.js文件，它应该可以按预期工作。

于 2012-10-23T02:23:01.580 回答