form - jquery ui windows

jquery ui: no se puede llamar a los métodos en el diálogo antes de la inicialización; intentó llamar al método ''cerrar''

Question

Estoy usando el diálogo jquery ui, lo descargo desde el sitio web de jquery ui, la versión es jquery-ui-1.10.2.custom.min.js, y jquery es jquery-1.9.1.js que está incluido con jquery ui js, pero ahora me encuentro con una pregunta: cuando se abre el cuadro de diálogo y hace clic en el botón Guardar, quiero que se cierre el diálogo, aquí está mi código:

$(function(){
$("#dialog-form").dialog({
autoOpen: false,
height: 350,
width: 450,
modal: true,
buttons: {
"save": function() {
if(!checkDept()){
return ;
}
$.post(''dept_save.do'',
{''dept.deptId'':$("#dialog_dept_deptId").val(),
''dept.deptName'':$("#dialog_dept_deptName").val(),
''dept.manager'':$("#dialog_dept_manager").val(),
},function(data, status, xhr){
if(status == ''success''){
alert(''save success'');
$(this).dialog("close");
}else{
alert(''error:''+data);
}
}
,"json");
}
},
close: function() {
$(this).dialog("close");
}
});
/* to open dialog*/
$("#add").click(function(){
$("#dialog-form").dialog("open");
});

ahora, cuando cierro el cuadro de dialog-form "salvar el éxito", el dialog-form diálogo no se cierra y se produce un error:

Error no detectado: no se puede llamar a los métodos en el diálogo antes de la inicialización; intentó llamar al método ''cerrar'' jquery-1.9.1.js: 507.

y hay otro error:

Untaught SyntaxError: Token inesperado o jquery-1.9.1.js: 541

Gracias.

Answer 1

Cuando inicializa un diálogo llamando al .dialog(options) , se crea un nuevo diálogo, pero no está asociado al div original que desea convertir en diálogo (el ''# dialog-form'' en su código de muestra). La función de dialog(options) devuelve el elemento que contiene los datos de diálogo. Entonces, si lo haces de esta manera:

var myDialog = $("#dialog-form").dialog(options);

A continuación, puede llamar al método abierto de esta manera:

myDialog.dialog(''open'');

Si desea encontrar el elemento que contiene el diálogo, es el div más cercano con la clase "ui-dialog-content":

var myDialog = $(''#dialog-form'').closest(''div.ui-dialog-content'');

Los datos de diálogo son los datos de uiDialog que verá si mira los datos de este elemento:

myDialog.data();

Answer 2

Estás perdiendo el contexto de this una vez que estás dentro de $.post() . Antes de $ .post, guarde el contexto en una variable dentro de esa función de botón de guardar .

$(''#dialog-form'').dialog({
// .....
buttons: {
''save'': function() {
var $this = $(this);
// -this- is still the original context
// of $("#dialog-form")
$.post({
/// ...
$this.dialog(''close''); // <-- used here
});
}
}
});

Answer 3

Otra cosa que puede causar este error es si por alguna razón llama a removeData () en el cuadro de diálogo. Aparentemente, la función jquery data () se usa para inicializar el cuadro de diálogo, por lo que si por algún motivo se eliminan los datos, el cuadro de diálogo no pensará que se ha inicializado.

Descubrí esto cuando estaba almacenando datos de formulario en el objeto de diálogo con la función data () y luego llamé a removeData () en el cuadro de diálogo justo antes de cerrarlo.

Answer 4

Tuve que hacer lo siguiente para cerrar mi diálogo.

 $("#Note").dialog({
autoOpen: true,
modal: true,
create: function (e, ui) {
//
},
open: function () {
//
},
buttons: {
//
$(".ui-dialog-titlebar-close").trigger(''click'');
}
}
});

Answer 5

es posible que haya utilizado una ventana emergente en lugar de un cuadro de diálogo. Creo que los métodos para cerrar los dos son diferentes. intente usar $("#popid").popup(''close'');

Answer 6

$(this) no se dirige al cuadro de diálogo dentro de $.post , deberá almacenar una referencia al mismo.

var self = this; // add this
$.post(..., function(){
$(self).dialog("close"); // modify this to use self