jquery ui Dialog: Vor der Initialisierung können keine Methoden für den Dialog aufgerufen werden

Ich habe eine App auf JQuery 1.5 mit gut funktionierenden Dialogen. Obwohl ich viele .live-Handler habe, habe ich dies in .on geändert. Dafür muss ich jquery aktualisieren (jetzt 1.8.3 und jquerui 1.9.1).

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

Es folgt 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 dies passieren könnte?

Versuchen Sie dies stattdessen

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

Sie können auch tun:

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

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

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 so umgehen:

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

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

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

Ich würde dies nur empfehlen, wenn die Verwendung closestein Leistungsproblem verursacht. Es gibt wahrscheinlich andere Möglichkeiten, dies zu umgehen, ohne alle Dialoge global zu schließen.

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 aktualisierte, wurde der obige Fehler angezeigt. Als ich die fehlerhaften .closeMethodenzeilen auskommentierte, gab es einen Fehler, dass ich nicht gefunden habe.browserin der jquery-Bibliothek, die in jquery 1.8.3 veraltet und aus jquery 1.9.1 entfernt wurde. Grundsätzlich war die Bibliothek jquery 1.9.1 nicht mit der Bibliothek jquery ui 1.9.0 kompatibel, obwohl auf der Download-Seite von jquery ui angegeben wurde, dass sie mit jquery 1.6+ funktioniert. Im Wesentlichen gibt es nicht gemeldete Fehler, wenn versucht wird, unterschiedliche Versionen der beiden zu verwenden. Wenn Sie die jquery-Version verwenden, die im Lieferumfang des jqueryui-Downloads enthalten ist, sind Sie sicher in Ordnung, aber wenn Sie verschiedene Versionen verwenden, sind Sie abseits der ausgetretenen Pfade und erhalten Fehler wie diese. Zusammenfassend ist dieser Fehler also auf falsch übereinstimmende Versionen zurückzuführen (in meinem Fall sowieso).

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-Klickereignis erstellen:

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

dann in Teilansicht HTML rufen Sie Button Trigger Klick wie:

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

Tschüss.

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

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

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

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

Mit der neuen jQuery-UI-Version können Sie keine UI-Methoden für nicht initialisierte Dialoge aufrufen. Um dieses Problem zu umgehen, können Sie anhand der folgenden Überprüfung überprüfen, ob der Dialog aktiv ist.

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

Dies ist auch eine Lösung:

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

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

In meinem Fall bestand das Problem darin, dass ich $("#divDialog").removeData();im Rahmen des Zurücksetzens meiner Formulardaten im Dialogfeld angerufen hatte .

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

Ich habe durch .removeData()spezifischere Löschvorgänge ersetzt und alles hat wieder funktioniert.

Mein Fall ist anders, er schlägt aufgrund des Umfangs von " dies " fehl :

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

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

Ich habe diese Fehlermeldung erhalten, weil ich das div-Tag in der Teilansicht anstelle der übergeordneten Ansicht hatte