Question

我有两个嵌套在另一个内部的视图。父视图具有树视图，其每个节点都是链接。单击某个节点时，相应地更改子视图（子视图的内容或子视图本身将替换为另一个。）但这会导致树视图折叠到其初始状态。我怎么能阻止它这样做？我了解AJAX并且有足够的经验。但是我还没有将AJAX用于MVC。非常感谢一点帮助。

Answer 1

我终于找到了一个非常优雅而且不仅仅是内置的方式来做到这一点。是的，它确实需要AJAX（无论如何它会怎么做？）感谢Darin Dimitrov his excellent answer我现在能够做到我需要的东西。

正如我所说，我有一个父视图，其中我有一个带有链接节点的树视图。每次单击节点时，都必须重新加载子视图。但这会导致父视图重新加载，从而导致树视图崩溃。我做的第一件事是创建一个强类型的子视图的局部视图，并将所有html内容从子视图移动到新创建的局部视图。然后我用Razor替换纯html来创建锚元素。在树节点之前是这样的：

<input type="checkbox" id="item-0" /><label for="item-0"><a href="/cabinet/inbox">Documents</a></label>

现在就是这样：

<input type="checkbox" id="item-0" /><label for="item-0">@Ajax.ActionLink("Documents(AJAX)","Inbox","Cabinet",new AjaxOptions{UpdateTargetId="partialViewContainer"})</label>

正如您所看到的，AJAX帮助器方法创建了相同的链接，但这次也将请求设置为异步。这样做的美妙之处在于我不必为了让AJAX正常工作而搞乱其他任何事情，一切都在幕后完成。我只需要确保包含jquery.unobtrusive-ajax.js并在web.config中启用unobstrusivejavascript，这是默认行为。当然，我需要在视图中的某个位置有一个名为partialViewContainer的容器来保存局部视图。（注意AjaxOptions{UpdateTargetId="partialViewContainer"})）

最后，我需要更改action方法以返回部分视图而不是正常视图。以下是我需要改变的唯一一条线：

  public ActionResult Inbox(string docType){       
     ...........
     return PartialView("MyPartialView",myModel);
  }

单击节点时如何防止母版页中的树视图折叠

1 个答案: