Javascript 第一次尝试时无法打开JQuery UI对话框

我正在尝试打开一个对话框，其中显示有关事件的信息。可以使用按钮打开另一个对话框，该对话框允许编辑事件和删除事件

问题是，在第一次尝试打开编辑对话框时，什么都没有发生，而删除对话框的功能却很好。关闭主对话框并重新打开后，单击按钮时也会显示编辑对话框

我想这与编辑对话框的视图有关，因为删除对话框没有，并且打开正确。
这不是ajax问题（事件是从数据库中获取的），它是在初始化对话之前加载的

对话框在同一元素“eventDialog”中调用，并在关闭主对话框后正确删除

提前感谢：）

以下是一些代码：

主对话框

$.Controller('COPD.Controller.PatientHeader.Dialog',
/** @Static */
{   
defaults: {
    patientID: 2,
    eventID: 0,
},

},
/** @Prototype */
{
/*
 * All of this class' work is done in this constructor
 */

init : function(){

    this.element.append('<span id=\"eventDialog\"></span>');
    $('#eventDialog').html('COPD/controller/patient_details/controller/patient_header/views/patientHeaderDialog.ejs', 
            {event: COPD.Models.TreatmentEvent.findOneDebug({behandlungsEventID: this.options.eventID},
            this.proxy(function(success) {
                $("#eventDialog").dialog({
                    show:"fade",
                    hide:"fade",
                    height:"auto",
                    width:500,
                    draggable:false,
                    resizable:false,
                    modal:true,
                    position:"center",
                    title:success[0].behandlungskategorie.name,
                    create: this.proxy(function(){this.initDialogs(success);}),
                    close: this.proxy(function(){this.destroy();}),
                    buttons: [{text:"Bearbeiten", click: this.proxy(function() {this.openEditEvent();})},
                              {text:"Löschen", click: this.proxy(function() {this.openDeleteEvent();})},
                              {text:"Schließen", click: function() {$(this).dialog("close");}},],
                });

            }))});
},

// Standard destroy()-Funktion
destroy : function() {
    $('#eventDialog').copd_patient_header_dialog_edit("destroy");
    $('#eventDialog').copd_patient_header_dialog_delete("destroy");
    $('#eventDialog').remove();
    this._super();
},

initDialogs : function(event) {
    $('#eventDialog').copd_patient_header_dialog_delete({event: event});
    $('#eventDialog').copd_patient_header_dialog_edit({event: event});
},

openEditEvent : function() {
    $('#editEvent').dialog("open");
},

openDeleteEvent : function() {
    $('#deleteEvent').dialog("open");
},


});

});

$.Controller('COPD.Controller.PatientHeader.Dialog.Edit',
/** @Static */
{   
defaults: {
    patientID: 2,
    eventID: 0,
    event: null,
},

},
/** @Prototype */
{
/*
 * All of this class' work is done in this constructor
 */

init : function(){
    console.log("Der Edit-Event-Dialog wird jetzt initialisiert!");
    this.element.append('<span id=\"editEvent\"></span>');
    $("#editEvent").html('COPD/controller/patient_details/controller/patient_header/views/patientHeaderDialogEdit.ejs', {
        behandlungskategorien: COPD.Models.TreatmentCategory.findAll(),
        event: this.options.event[0],
    }, this.proxy(function() {
        $("#editEvent").dialog({
            show:"fade",
            hide:"fade",
            height:"auto",
            width:500,
            draggable:false,
            resizable:false,
            modal:true,
            autoOpen:false,
            title:this.options.event[0].behandlungskategorie.name + " bearbeiten",
            buttons: [{text:"Speichern", click: this.proxy(function(){this.updateEvent();})},
                      {text:"Schließen", click: function(){$(this).dialog("close");}},],

        });
    }));
    console.log("Event:", this.options.event[0]);
},

// Standard destroy()-Funktion
destroy : function() {
    $('#editEvent').remove();
    this._super();
},

updateEvent : function() {
//updates the event
},


});

});

$.Controller('COPD.Controller.PatientHeader.Dialog.Delete',
/** @Static */
{   
defaults: {
    patientID: 2,
    eventID: 0,
    event: null,
},

},
/** @Prototype */
{
/*
 * All of this class' work is done in this constructor
 */

init : function(){
    console.log("Der Delete-Event-Dialog wird jetzt initialisiert!");
    this.element.append('<span id=\"deleteEvent\"></span>');
    $("#deleteEvent").html('<br>Wollen Sie wirklich das Behandlungsevent löschen?<br><br>\''+ this.options.event[0].behandlungskategorie.name + '\'<br>' + this.options.event[0].hinweisText);
    $("#deleteEvent").dialog({
        show:"fade",
        hide:"fade",
        height:"auto",
        width:500,
        draggable:false,
        resizable:false,
        modal:true,
        autoOpen:false,
        position:"center",
        title:"Wirklich Löschen?",
        buttons: [{text:"Ja", click:function()    {this.hideEvent(this.options.event);}},
                  {text:"Nein", click:function()    {$(this).dialog("close");}},],
    });
},

// Standard destroy()-Funktion
destroy : function() {
    $('#deleteEvent').remove();
    this._super();
},

hideEvent : function() {

}


 });

});

$.Controller（'COPD.Controller.PatientHeader.Dialog'，
/**@静态*/
{   
默认值：{
病人：2，
eventID:0，
},
},
/**@原型*/
{
/*
*这个类的所有工作都是在这个构造函数中完成的
*/
init:function（）{
this.element.append（“”）；
$（'#eventDialog'）.html（'COPD/controller/patient_details/controller/patient_header/views/patientTheaderDialog.ejs'，
{event:COPD.Models.TreatmentEvent.findOneDebug（{behandlungsEventID:this.options.eventID}，
this.proxy（函数（成功）{
$（“#事件对话框”）。对话框({
显示：“褪色”，
隐藏：“褪色”，
高度：“自动”，
宽度：500，
可拖动：错误，
可调整大小：false，
莫代尔：是的，
位置：“中心”，
标题：成功[0]。behandlungsategorie.name，
create:this.proxy（函数（）{this.initDialogs（success）；}），
close:this.proxy（函数（）{this.destroy（）；}），
按钮：[{text:“Bearbeiten”，单击：this.proxy（function（）{this.openEditEvent（）；}）}，
{text:“Löschen”，单击：this.proxy（function（）{this.openDeleteEvent（）；}）}，
{text:“Schließen”，单击：function（）{$（this）.dialog（“close”）；}}，]，
});
}))});
},
//标准销毁（）函数
销毁：函数（）{
$（“#事件对话框”）.copd患者标题对话框编辑（“销毁”）；
$（“#eventDialog”）.copd_患者_标题_对话框_删除（“销毁”）；
$（'#eventDialog'）。删除（）；
这个；
},
初始化对话框：函数（事件）{
$（'eventDialog'）。copd患者\标题\对话框\删除（{event:event}）；
$（'eventDialog'）。copd患者\标题\对话框\编辑（{event:event}）；
},
openEditEvent:function（）{
$（'editEvent'）。对话框（“打开”）；
},
openDeleteEvent:函数（）{
$（'#deleteEvent'）。对话框（“打开”）；
},
});
});

编辑对话框

$.Controller('COPD.Controller.PatientHeader.Dialog',
/** @Static */
{   
defaults: {
    patientID: 2,
    eventID: 0,
},

},
/** @Prototype */
{
/*
 * All of this class' work is done in this constructor
 */

init : function(){

    this.element.append('<span id=\"eventDialog\"></span>');
    $('#eventDialog').html('COPD/controller/patient_details/controller/patient_header/views/patientHeaderDialog.ejs', 
            {event: COPD.Models.TreatmentEvent.findOneDebug({behandlungsEventID: this.options.eventID},
            this.proxy(function(success) {
                $("#eventDialog").dialog({
                    show:"fade",
                    hide:"fade",
                    height:"auto",
                    width:500,
                    draggable:false,
                    resizable:false,
                    modal:true,
                    position:"center",
                    title:success[0].behandlungskategorie.name,
                    create: this.proxy(function(){this.initDialogs(success);}),
                    close: this.proxy(function(){this.destroy();}),
                    buttons: [{text:"Bearbeiten", click: this.proxy(function() {this.openEditEvent();})},
                              {text:"Löschen", click: this.proxy(function() {this.openDeleteEvent();})},
                              {text:"Schließen", click: function() {$(this).dialog("close");}},],
                });

            }))});
},

// Standard destroy()-Funktion
destroy : function() {
    $('#eventDialog').copd_patient_header_dialog_edit("destroy");
    $('#eventDialog').copd_patient_header_dialog_delete("destroy");
    $('#eventDialog').remove();
    this._super();
},

initDialogs : function(event) {
    $('#eventDialog').copd_patient_header_dialog_delete({event: event});
    $('#eventDialog').copd_patient_header_dialog_edit({event: event});
},

openEditEvent : function() {
    $('#editEvent').dialog("open");
},

openDeleteEvent : function() {
    $('#deleteEvent').dialog("open");
},


});

});

$.Controller('COPD.Controller.PatientHeader.Dialog.Edit',
/** @Static */
{   
defaults: {
    patientID: 2,
    eventID: 0,
    event: null,
},

},
/** @Prototype */
{
/*
 * All of this class' work is done in this constructor
 */

init : function(){
    console.log("Der Edit-Event-Dialog wird jetzt initialisiert!");
    this.element.append('<span id=\"editEvent\"></span>');
    $("#editEvent").html('COPD/controller/patient_details/controller/patient_header/views/patientHeaderDialogEdit.ejs', {
        behandlungskategorien: COPD.Models.TreatmentCategory.findAll(),
        event: this.options.event[0],
    }, this.proxy(function() {
        $("#editEvent").dialog({
            show:"fade",
            hide:"fade",
            height:"auto",
            width:500,
            draggable:false,
            resizable:false,
            modal:true,
            autoOpen:false,
            title:this.options.event[0].behandlungskategorie.name + " bearbeiten",
            buttons: [{text:"Speichern", click: this.proxy(function(){this.updateEvent();})},
                      {text:"Schließen", click: function(){$(this).dialog("close");}},],

        });
    }));
    console.log("Event:", this.options.event[0]);
},

// Standard destroy()-Funktion
destroy : function() {
    $('#editEvent').remove();
    this._super();
},

updateEvent : function() {
//updates the event
},


});

});

$.Controller('COPD.Controller.PatientHeader.Dialog.Delete',
/** @Static */
{   
defaults: {
    patientID: 2,
    eventID: 0,
    event: null,
},

},
/** @Prototype */
{
/*
 * All of this class' work is done in this constructor
 */

init : function(){
    console.log("Der Delete-Event-Dialog wird jetzt initialisiert!");
    this.element.append('<span id=\"deleteEvent\"></span>');
    $("#deleteEvent").html('<br>Wollen Sie wirklich das Behandlungsevent löschen?<br><br>\''+ this.options.event[0].behandlungskategorie.name + '\'<br>' + this.options.event[0].hinweisText);
    $("#deleteEvent").dialog({
        show:"fade",
        hide:"fade",
        height:"auto",
        width:500,
        draggable:false,
        resizable:false,
        modal:true,
        autoOpen:false,
        position:"center",
        title:"Wirklich Löschen?",
        buttons: [{text:"Ja", click:function()    {this.hideEvent(this.options.event);}},
                  {text:"Nein", click:function()    {$(this).dialog("close");}},],
    });
},

// Standard destroy()-Funktion
destroy : function() {
    $('#deleteEvent').remove();
    this._super();
},

hideEvent : function() {

}


 });

});

$.Controller（'COPD.Controller.PatientHeader.Dialog.Edit'，
/**@静态*/
{   
默认值：{
病人：2，
eventID:0，
事件：null，
},
},
/**@原型*/
{
/*
*这个类的所有工作都是在这个构造函数中完成的
*/
init:function（）{
log（“使用jetzt initialisert！编辑事件对话框”）；
this.element.append（“”）；
$（“#editEvent”）.html（'COPD/controller/patient_details/controller/patient_header/views/patient theaderDialogEdit.ejs'{
behandlungskategorien:COPD.Models.TreatmentCategory.findAll（），
事件：此.options.event[0]，
}，this.proxy（函数（）{
$（“#编辑事件”）。对话框({
显示：“褪色”，
隐藏：“褪色”，
高度：“自动”，
宽度：500，
可拖动：错误，
可调整大小：false，
莫代尔：是的，
自动打开：错误，
标题：this.options.event[0]。behandlungsategorie.name+“bearbeiten”，
按钮：[{text:“speichen”，单击：this.proxy（函数（）{this.updateEvent（）；}）}，
{text:“Schließen”，单击：function（）{$（this）.dialog（“close”）；}}，]，
});
}));
log（“事件：，this.options.Event[0]）；
},
//标准销毁（）函数
销毁：函数（）{
$（'#editEvent'）。删除（）；
这个；
},
updateEvent:function（）{
//更新事件
},
});
});

删除对话框

$.Controller('COPD.Controller.PatientHeader.Dialog',
/** @Static */
{   
defaults: {
    patientID: 2,
    eventID: 0,
},

},
/** @Prototype */
{
/*
 * All of this class' work is done in this constructor
 */

init : function(){

    this.element.append('<span id=\"eventDialog\"></span>');
    $('#eventDialog').html('COPD/controller/patient_details/controller/patient_header/views/patientHeaderDialog.ejs', 
            {event: COPD.Models.TreatmentEvent.findOneDebug({behandlungsEventID: this.options.eventID},
            this.proxy(function(success) {
                $("#eventDialog").dialog({
                    show:"fade",
                    hide:"fade",
                    height:"auto",
                    width:500,
                    draggable:false,
                    resizable:false,
                    modal:true,
                    position:"center",
                    title:success[0].behandlungskategorie.name,
                    create: this.proxy(function(){this.initDialogs(success);}),
                    close: this.proxy(function(){this.destroy();}),
                    buttons: [{text:"Bearbeiten", click: this.proxy(function() {this.openEditEvent();})},
                              {text:"Löschen", click: this.proxy(function() {this.openDeleteEvent();})},
                              {text:"Schließen", click: function() {$(this).dialog("close");}},],
                });

            }))});
},

// Standard destroy()-Funktion
destroy : function() {
    $('#eventDialog').copd_patient_header_dialog_edit("destroy");
    $('#eventDialog').copd_patient_header_dialog_delete("destroy");
    $('#eventDialog').remove();
    this._super();
},

initDialogs : function(event) {
    $('#eventDialog').copd_patient_header_dialog_delete({event: event});
    $('#eventDialog').copd_patient_header_dialog_edit({event: event});
},

openEditEvent : function() {
    $('#editEvent').dialog("open");
},

openDeleteEvent : function() {
    $('#deleteEvent').dialog("open");
},


});

});

$.Controller('COPD.Controller.PatientHeader.Dialog.Edit',
/** @Static */
{   
defaults: {
    patientID: 2,
    eventID: 0,
    event: null,
},

},
/** @Prototype */
{
/*
 * All of this class' work is done in this constructor
 */

init : function(){
    console.log("Der Edit-Event-Dialog wird jetzt initialisiert!");
    this.element.append('<span id=\"editEvent\"></span>');
    $("#editEvent").html('COPD/controller/patient_details/controller/patient_header/views/patientHeaderDialogEdit.ejs', {
        behandlungskategorien: COPD.Models.TreatmentCategory.findAll(),
        event: this.options.event[0],
    }, this.proxy(function() {
        $("#editEvent").dialog({
            show:"fade",
            hide:"fade",
            height:"auto",
            width:500,
            draggable:false,
            resizable:false,
            modal:true,
            autoOpen:false,
            title:this.options.event[0].behandlungskategorie.name + " bearbeiten",
            buttons: [{text:"Speichern", click: this.proxy(function(){this.updateEvent();})},
                      {text:"Schließen", click: function(){$(this).dialog("close");}},],

        });
    }));
    console.log("Event:", this.options.event[0]);
},

// Standard destroy()-Funktion
destroy : function() {
    $('#editEvent').remove();
    this._super();
},

updateEvent : function() {
//updates the event
},


});

});

$.Controller('COPD.Controller.PatientHeader.Dialog.Delete',
/** @Static */
{   
defaults: {
    patientID: 2,
    eventID: 0,
    event: null,
},

},
/** @Prototype */
{
/*
 * All of this class' work is done in this constructor
 */

init : function(){
    console.log("Der Delete-Event-Dialog wird jetzt initialisiert!");
    this.element.append('<span id=\"deleteEvent\"></span>');
    $("#deleteEvent").html('<br>Wollen Sie wirklich das Behandlungsevent löschen?<br><br>\''+ this.options.event[0].behandlungskategorie.name + '\'<br>' + this.options.event[0].hinweisText);
    $("#deleteEvent").dialog({
        show:"fade",
        hide:"fade",
        height:"auto",
        width:500,
        draggable:false,
        resizable:false,
        modal:true,
        autoOpen:false,
        position:"center",
        title:"Wirklich Löschen?",
        buttons: [{text:"Ja", click:function()    {this.hideEvent(this.options.event);}},
                  {text:"Nein", click:function()    {$(this).dialog("close");}},],
    });
},

// Standard destroy()-Funktion
destroy : function() {
    $('#deleteEvent').remove();
    this._super();
},

hideEvent : function() {

}


 });

});

$.Controller（'COPD.Controller.PatientHeader.Dialog.Delete'，
/**@静态*/
{   
默认值：{
病人：2，
eventID:0，
事件：null，
},
},
/**@原型*/
{
/*
*这个类的所有工作都是在这个构造函数中完成的
*/
init:function（）{
log（“Der Delete Event Dialog wird jetzt initialisiert！”）；
this.element.append（“”）；
$（“#deleteEvent”）.html（“
Wollen Sie wirklich das Behandlungsevent löschen？
\''+this.options.event[0].behandlungsteagorie.name+”\'
'+this.options.event[0].hinweisText）；
$（“#删除事件”）。对话框({
显示：“褪色”，
隐藏：“褪色”，
高度：“自动”，
宽度：500，
可拖动：错误，
可调整大小：false，
莫代尔：是的，
自动打开：错误，
位置：“中心”，
标题：“维克利希·Löschen？”，
按钮：[{text:“Ja”，单击：function（）{this.hideEvent（this.options.event）；}，
{text:“不”，单击：function（）{$（this）.dialog（“close”）；}}，]，
});
},
//标准销毁（）函数
销毁：函数（）{
$（'#deleteEvent'）。删除（）；
这个；
},
hideEvent:function（）{
}
});
});

问题解决了，在大量搜索和查看xmlHttpRequests后，我意识到这是一个同步问题。甚至在获取数据之前就已经加载了视图，这实际上不应该发生

使用jquery.Model插件提供的

$.when（fetchItems（））.done（function（itemsFetched）{//doSomething}）

函数使视图等待数据加载并随后初始化。

您能在jquery.Model插件上设置演示吗