1

我在 jQuery UI 对话框中有一个由 AJAX 加载的 jqGrid。一切正常,除了没有关闭的对话框。当我单击两个按钮时,它会到达警报,但对话框没有被关闭。

buttons: {
    'Confirm': function() {
        alert('OK Confirm');
        $('#test-grid').dialog('close');
    },
    'Cancelar': function() {
        alert('OK Cancel');
        $(this).dialog('close');
    }
}

我试过$('#test-grid').dialog('close')and $(this).dialog('close'),但没有人工作。如果我删除由 AJAX 加载的 jqGrid,一切正常。Firefox 和 Chrome 上的错误控制台为空。

我正在加载 jqGrid 页面:

$('#test-grid').load('/grid').dialog('open');

谁能帮我?

更新

我尝试使用 AJAX 加载一个简单的 HTML 片段,但问题仍然存在。

4

1 回答 1

1

问题是调用load干扰了打开对话框的调用。您可以通过将 AJAX 内容加载到test-grid. 例如:

 $('#test-grid-child').load('/grid');
 $('#test-grid').dialog('open');


更新

我刚刚阅读了文档load并对此进行了更多思考。发生的情况是,在$('#test-grid').load('/grid').dialog('open');执行代码时,会启动 AJAX 请求并立即创建对话框。但是一旦load的 AJAX 请求完成,jQuery 就会返回并覆盖#test-grid. 这解释了为什么无法关闭对话框,因为底层标记是从对话框对象下方修改出来的。

将数据检索到子元素消除了这个问题,因为load现在dialog每个元素都操作 DOM 的不同部分。

请注意,如果 AJAX 请求需要很长时间才能完成,您可能需要考虑实现一个complete功能来向用户提供反馈 - 可能通过显示微调器直到数据准备好。例如:

$('#test-grid-child').load('ajax/test.html', function() {
  alert('Load was performed.'); // Perform any necessary UI action here
});

无论如何,比您可能需要的更多信息,但我只是想在我脑海中仍然新鲜的时候更新这个问题......

于 2012-06-18T21:12:18.597 回答