Question

我有一个mvc3网络应用程序我使用了共享视图查看 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>

基本上，从上面的代码我用控制器返回

替换我的“main”div

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

这是我的控制器（没什么特别的）

DashboardController

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

MapController

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

当我加载页面并单击“Dashboard”或“Map View”链接时，整个页面会闪烁并刷新。假设是@ Ajax.ActionLink不刷新整个页面，而只是刷新“主”div。有没有办法让ajax之类的行为只刷新内容部分？有人可以帮忙吗？谢谢！

Answer 1

这是因为你从包含整个母版页（即你的布局）的控制器代码返回整个视图。

您只需渲染信息中心或地图的部分视图。像：

DashboardController

[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();
        }
    }

Answer 2

你的不显眼的Javascript包含缺失所以动作链接实际上没有“真正的”ajax链接，因为没有附加事件处理程序（unobtrusive-ajax脚本基本上查找属性data-ajax = true和attaches的所有链接它的方法来做ajax的东西）。

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

Answer 3

如上所述我发现这也很有用..没有把视图放在_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();
    }
}

视图共享_Layout.cshtml中的MVC3 Ajax Ajax.ActionLink

3 个答案: