Я неожиданно получаю эту ошибку от jQuery:
Ошибка: невозможно вызвать методы в диалоговом окне до инициализации; попытался вызвать метод "закрыть"
Плагины
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
Код jQuery
Я получаю эти сообщения в следующей функции:
$(document).ready(function() {
if ($('#results').html().length != 0) {
alert('has information');
$('#dialog').dialog({
modal: true,
buttons: {
Ok: function() {
// If I use $(this).dialog($(this)).dialog('close'), the UI is displayed,
// however I do not see the OK button and no errors
$(this).dialog('close');
}
}
});
} else {
alert('has no data');
}
});
HTML
<div id="dialog" title="Server Response">
<p><span class="${icon}" style="float: left; margin: 0 7px 50px 0;"></span>
<label id="results">${results}</label>
</p>
</div>
Похоже, что ваши кнопки не объявлены правильно (в соответствии с последней версией jQuery UI).
попробуйте следующее:
$( ".selector" ).dialog({
buttons: [{
text: "Ok",
click: function() {
$( this ).dialog( "close" );
}
}]
});
У меня была аналогичная проблема при открытии диалога с частичной компоновкой в asp.net MVC. Я загружал библиотеку jquery на частичной странице, а также на главную страницу, которая вызывала эту ошибку.
Попробуйте это - это работает для меня:
$(".editDialog").on("click", function (e) {
var url = $(this).attr('href');
$("#dialog-edit").dialog({
title: 'Edit Office',
autoOpen: false,
resizable: false,
height: 450,
width: 380,
show: { effect: 'drop', direction: "up" },
modal: true,
draggable: true,
open: function (event, ui) {
$(this).load(url);
},
close: function (event, ui) {
$("#dialog-edit").dialog().dialog('close');
}
});
$("#dialog-edit").dialog('open');
return false;
});
Надеюсь, это поможет вам.
Является ли ваш $(this).dialog("close") случайным вызовом из-за обратного вызова "успех" Ajax? Если да, попробуйте добавить context: this в качестве одного из вариантов вашего вызова $.ajax(), например:
$("#dialog").dialog({
modal: true,
buttons: {
Ok: function() {
$.ajax({
url: '/path/to/request/url',
context: this,
success: function(data)
{
/* Calls involving $(this) will now reference
your "#dialog" element. */
$(this).dialog( "close" );
}
});
}
}
});
Я также получил ту же ошибку: не могу вызывать методы в диалоге до инициализации; попытался вызвать метод "закрыть"
что я сделал, я вызвал событие кнопки закрытия, которое находится в заголовке диалога как
это отлично работает для закрытия диалогового окна
function btnClose() {
$(".ui-dialog-titlebar-close").trigger('click');
}
По какой-то причине пользовательский интерфейс jQuery попытается запустить весь код, определенный в кнопках во время определения. Это сумасшествие, но у меня была такая же проблема, и она остановилась, как только я сделал это изменение.
if ($(this).dialog.isOpen === true) {
$(this).dialog("close");
}
Я получил ту же ошибку в 1.10.2. В моем случае я хотел сделать щелчок по фону наложения скрытым видимым в данный момент диалогом, независимо от того, на каком элементе он был основан. Поэтому я имел это:
$('body').on("click", ".ui-widget-overlay", function () {
$(".ui-dialog").dialog('destroy');
});
Это работало, поэтому я думаю, что они должны были удалить поддержку в JQUI для вызова .dialog() во всплывающем окне в какой-то момент.
Мое обходное решение выглядит так:
$('body').on("click", ".ui-widget-overlay", function () {
$('#' + $(".ui-dialog").attr('aria-describedby')).dialog('destroy');
});
Я наткнулся на то же самое и хотел поделиться своим решением:
<script type="text/javascript">
$( "#dialog-confirm" ).dialog("option","buttons",
{
"delete": function() {
$.ajax({
url: "delete.php"
}).done(function(msg) {
//here "this" is the ajax object
$(this).dialog( "close" );
});
},
"cancel": function() {
//here, "this" is correctly the dialog object
$(this).dialog( "close" );
}
});
</script>
потому что "this" ссылается на объект без диалога, я получил упомянутую ошибку.
Решение:
<script type="text/javascript">
var theDialog = $( "#dialog-confirm" ).dialog("option","buttons",
{
"delete": function() {
$.ajax({
url: "delete.php"
}).done(function(msg) {
$(theDialog).dialog( "close" );
});
},
"cancel": function() {
$(this).dialog( "close" );
}
});
</script>
У меня была эта проблема раньше, когда одно диалоговое окно выдавало эту ошибку, а все остальные работали отлично. Ответ был потому, что у меня был другой элемент с тем же id="dialogBox" else ware на странице. Я нашел эту нить во время поиска, так что, надеюсь, это поможет кому-то еще.
Итак, вы используете это:
var opt = {
autoOpen: false,
modal: true,
width: 550,
height:650,
title: 'Details'
};
var theDialog = $("#divDialog").dialog(opt);
theDialog.dialog("open");
и если вы откроете Partial View MVC в диалоге, вы можете создать в индексе скрытую кнопку и событие JQUERY click:
$("#YourButton").click(function()
{
theDialog.dialog("open");
OR
theDialog.dialog("close");
});
затем внутри частичного вида html вы вызываете кнопку триггера, например:
$("#YouButton").trigger("click")
см. ya.
Это произошло для меня, когда мой аякс заменил содержимое на странице и в итоге появился два элемента того же класса для диалога, что означало, что когда моя строка закрывает диалог, выполненный на основе селектора классов CSS, он обнаружил два элемента: один и второй никогда не были инициализированы.
$(".dialogClass").dialog("close"); //This line was expecting to find one element but found two where the second had not been initialised.
Для любого из ASP.NET MVC это произошло из-за того, что действие моего контроллера возвращало полный вид, включая страницу общего размещения, в которой был элемент, когда он должен был возвращать частичный вид, поскольку javascript заменял только основную область содержимого.
У меня была аналогичная проблема, которую я разрешил, определяя мой массив кнопок вне объявления диалога.
var buttonArray = {};
buttonArray["Ok"] = function() { $( this ).dialog( "close" );}
Ваши варианты:
modal: true,
autoOpen: false,
buttons: buttonArray
Через час я нашел лучший подход. мы должны сохранить результат диалога в переменной, после этого метод закрытия вызова переменной.
Вот так:
var dd= $("#divDialog")
.dialog({
height: 600,
width: 600,
modal: true,
draggable: false,
resizable: false
});
// . . .
dd.dialog('close');
Я получал это сообщение об ошибке при попытке закрыть диалоговое окно с помощью кнопки внутри тела диалога. Я пытался использовать $('#myDialog').dialog('close');, который не работал.
В результате я нажал кнопку "x" в заголовке, используя:
$('.modal-header:first').find('button:first').click();
Senguttuvan: ваше решение было единственным, что сработало для меня.
Функция btnClose() {
$( "UI-диалог-Titlebar-близко." ) Триггер ('click').
}
У меня такая же проблема, я открываю несколько диалоговых окон, и моя проблема заключалась в том, что содержимое должно быть удалено, чтобы данные формы остались с одинаковыми данными, тогда в диалоговом окне создаются эти параметры
var dialog = $("#dummy-1");
dialog.html('<div style="position:absolute; top:15px; left:0px; right:0px; bottom:0px; text-align:center;"><img align="middle" src="cargando.gif"></div>');
dialog.html(mensaje);
dialog.dialog(
{
title:'Ventana de Confirmacion',
width:400,
height:200,
modal:true,
resizable: false,
draggable:false,
position: { my: "center center", at: "center center", of: window },
buttons:
[
{
text: "Eliminar",
click: function() {
functionCall(dialog,var1,var2);
}
},
{
text: "Cerrar",
click: function() {
dialog.dialog("close");
}
}
],
close: function(event, ui)
{
dialog.dialog("close").dialog("destroy").remove();
}
});
и диалог передается как параметр функции для выполнения действия:
function functionCall(dialogFormulario,var1,var2)
{
//same action
dialogFormulario.dialog("close");
}
Здесь нужно только использовать .dialog( "закрыть" ) и нет .dialog( "destroy" ), потому что диалог вызовет его функцию close: и элемент не будет существовать
У меня была аналогичная проблема, и в моем случае проблема была другой (я использую шаблоны Django).
Порядок JS был другим (я знаю, что первое, что вы проверяете, но я почти уверен, что это не так, но это было). Js, вызывающий диалог, вызывается до того, как была вызвана библиотека jqueryUI.
Я использую Django, поэтому наследовал шаблон и использовал {{super.block}} для наследования кода из блока и шаблона. Мне пришлось переместить {{super.block}} в конце блока, который решил проблему. Js, вызывающий диалог, был объявлен в классе Media в Django admin.py. Я потратил больше часа, чтобы понять это. Надеюсь, это поможет кому-то.
Создайте отдельную функцию JavaScript, которую можно вызывать, чтобы закрыть диалоговое окно с помощью определенного идентификатора объекта, и поместите функцию за пределы $(document).ready() следующим образом:
function closeDialogWindow() {
$('#dialogWindow').dialog('close');
}
ПРИМЕЧАНИЕ. Функция должна быть объявлена вне $(document).ready() поэтому jQuery не пытается вызвать событие закрытия в диалоговом окне перед его созданием в DOM.
Вы можете объявить содержимое кнопки вне диалога, это работает для меня.
var closeFunction = function() {
$(#dialog).dialog( "close" );
};
$('#dialog').dialog({
modal: true,
buttons: {
Ok: closeFunction
}
});
Я знаю, что это очень старая проблема, но у меня возникла та же проблема, когда при навигации по угловому маршруту и при открытом диалоговом окне оно оставалось открытым. Итак, я нашел способ вызвать метод close в деструкторе контроллера маршрута. Но получил эту вышеупомянутую ошибку, если диалог не был открыт. Так что ответ таков: если вы закрываете диалоговое окно перед инициализацией, это произойдет из-за этой ошибки. Чтобы проверить, открыто ли диалоговое окно, закройте его, обернув ваше состояние закрытия в этом состоянии.
if($('#mydialog').dialog('isOpen')) { //close dialog code}