1

想象一个带有“编辑”链接的简单用户列表。单击“编辑”会打开一个对话框,其中包含所选用户的详细信息。“详细信息”弹出窗口是部分视图。

在 JQuery 对话框窗口中打开部分视图时,我遇到了缓存部分视图的问题。

我的部分视图(注意 OutputCache 属性是我试图解决缓存问题的事情之一):

    [HttpGet]
    [OutputCache(NoStore = true, Duration = 0, VaryByParam = "*")]
    public PartialViewResult EditUser(int id)
    {
     var userList = userRepository.GetByRole(id);

     return PartialView("EditUser",userList);
    }

上面的 PartialView 是从以下 Javascript 函数请求和加载的:

function editUserOpen(id) {

    $.ajaxSetup({  ///// Another thing I tried to solve caching
        cache: false
    });

    var url = "/User/PartialViewResult/" + id;

    $('#user-wrap').empty().load(url, function () {

    $("#dialog-edit-user").dialog({
        title: "Edit User",
        autoOpen: false,
        height: 300,
        width: 500,
        modal: true
    });

        $('#dialog-edit-user').dialog("open");
    });
}

如上所示,“dialog-edit-user”(连同“dialog-add-user”和“dialog-delete-user”)位于 DOM 中的“user-wrap”Div 内。

功能上一切正常,但是当我打开一个对话框时,取消然后尝试为其他用户打开对话框,直到页面被刷新,对话框将始终包含来自最初显示的对话框的信息。我认为这是一个缓存问题,但我没有办法解决它。

如果可能的话,我想远离 $.ajax({ cache:false; }).html(content) 。在我看来,它比 .load() 慢得多。

4

2 回答 2

6

这是我发现的。

每次使用 .dialog() 初始化 JQuery 对话框时,如上所示,成为弹出窗口的 div 被从 DOM 中取出并移动到页面底部。Dialog Div 不能是另一个 Div 的子级。在我的例子中是:

<div id="user-wrap">
  <div id="dialog-edit-user">  /// <--- Jquery dialog div

  </div>
</div>

对话框不能包装在其他 div 中。

第一次单击后,当显示对话框时,JQuery 只是开始在页面底部累积重复的 Div。$("#").dialog('open')每次使程序员/用户认为这是一个缓存问题时,都会打开累积重复的最顶层 DIV。

所以解决方案是要么从页面底部删除由 JQuery 创建的 div,要么使用 JQuery /函数.dialog({close: }将其移回父包装器 DIV 。.append().appendTo()

希望这对遇到类似问题的下一个程序员有所帮助。

于 2012-07-18T01:19:02.717 回答
0

向 URL 添加一些随机哈希以保持其唯一性:

...
var url = "/User/PartialViewResult/" + id + "?t=" + new Date().getTime();
...

这将始终加载新内容。

于 2012-07-17T18:05:05.950 回答