wake-up-neo.net

jquery ui Dialog: Vor der Initialisierung können keine Methoden im Dialog aufgerufen werden

Ich habe eine App auf jquery 1.5 mit Dialogen, die einwandfrei funktioniert hat 1.9.1).

Nun bekam ich: Error: cannot call methods on dialog prior to initialization; attempted to call method 'close'

Folgendes ist der Code:

Javascript

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

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

hTML Quelltext

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

Irgendeine Idee, warum das passieren könnte?

91
core-chain.io

Versuchen Sie es stattdessen

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

Sie können auch tun:

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

Das liegt daran, dass der Dialog nicht in $('#divDialog') gespeichert ist, sondern in einem neuen Div, das im laufenden Betrieb erstellt und von der .dialog(opt)-Funktion zurückgegeben wird.

123

Wenn Sie jQuery nicht aktualisieren können und Folgendes erhalten:

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

Sie können es wie folgt umgehen:

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

Wenn Sie die Ansicht steuern und wissen, dass auf der gesamten Seite keine anderen Dialoge verwendet werden sollen, können Sie Folgendes tun:

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

Ich würde dies nur empfehlen, wenn die Verwendung von closest ein Leistungsproblem verursacht. Es gibt wahrscheinlich andere Möglichkeiten, dieses Problem zu umgehen, ohne in allen Dialogen ein globales Schließen durchzuführen.

18
Cymen

Ich habe diesen Fehler erhalten, als ich nur die Jquery-Bibliothek aktualisiert habe, ohne die Jqueryui-Bibliothek parallel zu aktualisieren. Ich habe jquery 1.8.3 mit jqueryui 1.9.0 verwendet. Als ich jedoch jquery 1.8.3 auf 1.9.1 aktualisiert habe, habe ich den obigen Fehler erhalten. Wenn ich die fehlerhaften .close-Methodenzeilen auskommentiert habe, gab es einen Fehler, dass .browser in der Jquery-Bibliothek nicht gefunden wurde, die in jquery 1.8.3 nicht mehr empfohlen wurde und aus jquery 1.9.1 entfernt wurde. Grundsätzlich war die Jquery-1.9.1-Bibliothek nicht mit der Jquery-Ui-1.9.0-Bibliothek kompatibel, obwohl auf der Jquery-Ui-Download-Seite angegeben wurde, dass sie mit Jquery 1.6+ funktioniert. Im Wesentlichen gibt es nicht gemeldete Fehler beim Versuch, unterschiedliche Versionen der beiden Versionen zu verwenden. Wenn Sie die Jquery-Version verwenden, die mit dem Jqueryui-Download geliefert wird, sind Sie sicher in Ordnung. Wenn Sie jedoch verschiedene Versionen verwenden, werden Sie den üblichen Pfad verlassen und Fehler wie diese erhalten. Zusammengefasst handelt es sich bei diesem Fehler also um fehlerhafte Versionen (in meinem Fall trotzdem).

9
johntrepreneur

Also benutzt du das:

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

wenn Sie eine MVC-Teilansicht im Dialogfeld öffnen, können Sie im Index eine ausgeblendete Schaltfläche und ein JQUERY-Click-Ereignis erstellen:

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

dann in der Teilansicht html rufen Sie den Button-Auslöser auf:

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

tschüss.

2

Wenn Sie den Dialog sofort öffnen möchten, wenn der Dialog initialisiert oder die Seite fertig ist, können Sie den Parameter autoOpen im Optionsobjekt des Dialogs auf true setzen:

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

Sie müssen also nicht den `$ (" # divDialog "). -Dialog (" open ") aufrufen. 

Wenn das Dialogobjekt initialisiert wird, wird der Dialog automatisch geöffnet.

2
Gašper Sladič

In der neuen jQuery-UI-Version können Sie keine UI-Methoden für nicht initialisierte Dialogfelder aufrufen. Um dieses Problem zu umgehen, können Sie anhand der folgenden Überprüfung feststellen, ob das Dialogfeld aktiv ist.

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

Dies ist auch etwas Arbeit um:

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

Mein Fall ist anders, es scheitert am Umfang von 'this':

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

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

In meinem Fall bestand das Problem darin, dass ich $("#divDialog").removeData(); beim Zurücksetzen meiner Formulardaten im Dialog aufgerufen hatte.

Dies führte dazu, dass ich eine Datenstruktur mit dem Namen uiDialog auslöschte, was bedeutete, dass der Dialog neu initialisiert werden musste.

Ich habe .removeData() durch spezifischere Löschungen ersetzt und alles begann wieder zu funktionieren.

0
AnthonyVO

Ich musste einfach den ScriptManager zur Seite hinzufügen. Problem gelöst.

0
gnardizzi