部分视图 - >> 如何刷新 HTML 内容而无需重定向到视图

Question

我的网站有一个类似于 Skype 的概念，它允许用户“在线”和“离线”。我创建了一个允许用户切换模式的局部视图：

@if (Convert.ToBoolean(ViewData["IsLogged"].ToString()))
{
<div id="onlineStatus">
    You are currently <strong>ONLINE</strong> >>
    @Html.ActionLink("Go OFFLINE", "GoOffline", "Account")
</div>
}
else
{
<div id="offlineStatus">
    Ready for business >>
    @Html.ActionLink("Go ONLINE", "GoOnline", "Account")
</div>           
}

这是我们加载局部视图的方式：

public ActionResult OnlineStatusCtrl()
{
     if (SiteUser.IsAuthenticated)
        ViewData["IsLogged"] = SiteUser.IsOnline.ToString();

      return PartialView("OnlineStatusCtrl");
}

当用户点击“Go ONLINE”或“Go OFFLINE”链接时，Controller 会响应：

public ActionResult GoOnline()
{
    if (SiteUser.IsAuthenticated)
        SiteUser.GoOnline();

    ViewData["IsLogged"] = "True";

    return RedirectToAction("Index", "Home");
    //return PartialView("OnlineStatusCtrl");
    //return EmptyResult();
}

public ActionResult GoOffline()
{
    if (SiteUser.IsAuthenticated)
        SiteUser.GoOffline(true);

    ViewData["IsLogged"] = "False";

    return RedirectToAction("Index", "Home");
}

这很好用……但唯一的问题是，如果我在 View XXXX 上，然后单击“Go Online”，控制器会将我重定向到索引视图。

我尝试了“return EmptyResult()”或“return PartialView("OnlineStatusCtrl")，但它不起作用。

从代码可以看出PartialView唯一关心的是“ViewData['IsLogged']值”

问题： 有什么方法可以刷新部分视图而无需刷新整个页面或重定向到主页？

这可能是放置一个 Html.Beginform() 的问题吗？ 是否可能是控制器返回的问题只是刷新了 PartialView 的内容，而与持有 PV 本身的视图无关？

Aiaiaiaia 我仍然无法弄清楚 MVC 如何与 PartialViews 一起工作/

非常感谢
...在高级

---

更新 我已经按照 x 的建议更新了代码，HTML 输出如下：

<div id="divStatus">
    <form action="/" data-ajax="true" data-ajax-mode="replace" data-ajax-update="#divStatus" id="form0" method="post">        
        <div id="offlineStatus">
            Ready for business >>
            <a href="/Account/GoOnline">Go Online</a>
        </div>
   </form>
</div>

当我点击 LINK 时，控制器 return PartialView("_OnlineStatusCtrl"); 是调用 PV 的名称 ...并且 ENTIRE PAGE 被替换。

Answer 1

您将不得不使用某种 ajax 调用（MVC 中内置的 Microsoft ajax 助手，或 jquery/javascript ajax 调用。

要使用 Microsoft 的 Ajax，您可以使用 Ajax.BeginForm 或 Ajax.ActionLink。两者都采用 AjaxOptions 参数，允许您为 OnSuccess 设置 javascript 函数，并采用 UpdateTargetId 来显示返回的数据（通常是部分视图）。使用它将调用您的操作，该操作应返回部分视图。然后，您的局部视图将替换由 UpdateTargetId 参数标识的 html 元素（通常是 div）。如果您决定走这条路，请确保您引用了所有正确的 Microsoft ajax/mvc 脚本。您几乎需要每个脚本与 Microsoft、Ajax、Mvc 的任意组合，甚至名称上不显眼。

这是我的一种 ajax 形式的示例（为简单起见稍作修改）

    <% using(Ajax.BeginForm("addAttribute", new { id = Model.PersonId, attributeId = item.AttributeId }, new AjaxOptions { UpdateTargetId = "myTargetId", OnSuccess = "initForm" })) { %>
        <input type="submit" value="Ok" class="editMode okButton" disabled="disabled" />
        <input type="button" class="editMode cancelButton" value="Cancel" />
        <br />
        <input type="button" value="Add" class="addButton" />
    <% } %>

我有一个 id 为“myTargetId”的 div（对于本示例），它将使用返回的局部视图进行更新。