jquery ui Dialog: cannot call methods on dialog prior to initialization

我在 jquery 1.5上有一个应用程序，它的对话框工作得很好。 While I have a lot of .live handlers, I changed this to .on. 为此，我必须更新 jquery (现在是1.8.3和 jquerui 1.9.1)。

现在，我得到了: Error: cannot call methods on dialog prior to initialization; attempted to call method 'close'

密码如下:

Javascript

var opt = {
autoOpen: false,
modal: true,
width: 550,
height:650,
title: 'Details'
};


$(document).ready(function() {
$("#divDialog").dialog(opt);
$("#divDialog").dialog("open");
...

Html 代码

<div id="divDialog">
<div id="divInDialog"></div>
</div>

知道为什么会这样吗？

225350 次浏览
小开
最佳答案

Try this instead

$(document).ready(function() {
$("#divDialog").dialog(opt).dialog("open");
});

你也可以这样做:

var theDialog = $("#divDialog").dialog(opt);
theDialog.dialog("open");

这是因为对话框不存储在 $('#divDialog')中，而是存储在动态创建并由 .dialog(opt)函数返回的新 div 上。

小开

当我只更新 jquery 库而没有并行更新 jqueryui 库时，我得到了这个错误。我在 jqueryui 1.9.0中使用的是 jquery 1.8.3。但是，当我将 jquery 1.8.3更新到1.9.1时，我得到了上面的错误。当我注释掉令人讨厌的 .close方法行时，它抛出了一个错误，没有在 jquery 库中找到 .browser，这个错误在 jquery 1.8.3中被弃用，并从 jquery 1.9.1中删除。所以基本上，jquery 1.9.1库与 jquery ui 1.9.0库不兼容，尽管 jquery ui 下载页面说它可以与 jquery 1.6 + 一起工作。实际上，在尝试使用两者的不同版本时，存在未报告的 bug。如果您使用与 jqueryui 下载捆绑在一起的 jquery 版本，我相信您会没问题的，但是当您开始使用不同的版本时，您会偏离常规，出现以下错误。因此，总的来说，这个错误来自不匹配的版本(在我的例子中)。

小开

如果你不能升级 jQuery，你会得到:

Uncaught Error: cannot call methods on dialog prior to initialization; attempted to call method 'close'

你可以这样做:

$(selector).closest('.ui-dialog-content').dialog('close');

或者，如果你控制了视图，并且知道整个页面上不应该使用其他对话框，你可以这样做:

$('.ui-dialog-content').dialog('close');

只有在使用 closest导致性能问题时，我才建议这样做。可能还有其他方法可以绕过这个问题，而不需要对所有对话进行全局关闭。

小开

这也是围绕以下问题开展的一些工作:

$("div[aria-describedby='divDialog'] .ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-icon-only.ui-dialog-titlebar-close").click();
小开

所以你用这个:

var theDialog = $("#divDialog").dialog(opt);
theDialog.dialog("open");

如果你在对话框中打开一个 MVC 部分视图，你可以在索引中创建一个隐藏按钮和 JQUERY 单击事件:

$("#YourButton").click(function()
{
theDialog.dialog("open");
OR
theDialog.dialog("close");
});

然后在部分视图 html 中你调用按钮触发点击如下:

$("#YouButton").trigger("click")

再见。

小开

我得到了这个错误消息，因为我在部分视图中使用了 div 标记，而不是在父视图中使用

小开

If you want to open the Dialog immediately when the Dialog is initialized or the page is ready, you can also set the parameter autoOpen to true in the options object of dialog:

var opt = {
autoOpen: true,
modal: true,
width: 550,
height:650,
title: 'Details'
};

因此，您不必调用‘ $(“ # divDialog”)

When dialog object is initialized, the dialog is automatically opened.

小开

I simply had to add the ScriptManager to the page. Issue resolved.

小开

在我的例子中，问题是我调用了 $("#divDialog").removeData();作为在对话框中重置表单数据的一部分。

这导致我清除了一个名为 uiDialog的数据结构，这意味着对话框必须重新初始化。

我用更具体的删除代替了 .removeData()，一切又开始工作了。

小开

My case is different, it fails because of the scope of '这个':

//this fails:
$("#My-Dialog").dialog({
...
close: ()=>{
$(this).dialog("close");
}
});


//this works:
$("#My-Dialog").dialog({
...
close: function(){
$(this).dialog("close");
}
});
小开

新的 jQueryUI 版本不允许您在未初始化的对话框上调用 UI 方法。作为解决方案，您可以使用下面的检查来查看对话框是否是活动的。

if (modalDialogObj.hasClass('ui-dialog-content')) {
// call UI methods like modalDialogObj.dialog('isOpen')
} else {
// it is not initialized yet
}

提交答案