it-swarm.com.de

JQuery-Fehler: Methoden können vor der Initialisierung nicht im Dialogfeld aufgerufen werden. hat versucht, die Methode 'close' aufzurufen

Ich bekomme plötzlich diese Fehlermeldung von jQuery:

Fehler: Methoden können vor der Initialisierung nicht im Dialog aufgerufen werden. hat versucht, die Methode 'close' aufzurufen

Plugins

 <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-Code  

Ich erhalte diese Nachrichten in der folgenden Funktion:

$(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>
50
devdar

Sieht so aus, als wären Ihre Schaltflächen nicht korrekt deklariert (laut Dokumentation der neuesten jQuery-Benutzeroberfläche trotzdem). 

versuche Folgendes:

$( ".selector" ).dialog({ 
   buttons: [{ 
      text: "Ok", 
      click: function() { 
         $( this ).dialog( "close" ); 
      }
   }]
});
20
Evil Raat

Ich hatte ein ähnliches Problem beim Öffnen eines Dialogs mit partiellem Layout in asp.net MVC. Ich habe die Jquery-Bibliothek auf der Teilseite sowie die Hauptseite geladen, die diesen Fehler verursacht hat.

24
Behr

Probieren Sie es aus - es funktioniert für mich:

$(".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;
});

Ich hoffe es wird dir helfen

14
EdsonF

Ich habe auch den gleichen Fehler: Methoden können vor der Initialisierung nicht im Dialog aufgerufen werden. hat versucht, die Methode 'close' aufzurufen

was ich getan habe, ist, dass ich das Schließen-Button-Ereignis auslöste, das sich im Dialog-Header befindet 

das funktioniert gut für mich, um den Dialog zu schließen

function btnClose() {
$(".ui-dialog-titlebar-close").trigger('click');
}

Ist es möglich, dass Ihre $(this).dialog("close") aus einem Ajax-Callback "Erfolg" aufgerufen wird? Wenn dies der Fall ist, fügen Sie context: this als eine der Optionen zu Ihrem $.ajax()-Aufruf hinzu:

$("#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" );
                }
            });
        }
    }
});
8
Adrian Lopez

es scheint, dass aus irgendeinem Grund die jQuery-Benutzeroberfläche versucht, den in Schaltflächen definierten Code zur Definitionszeit auszuführen. Es ist verrückt, aber ich hatte das gleiche Problem und es hörte auf, als ich diese Änderung vorgenommen hatte. 

if ($(this).dialog.isOpen === true) { 
    $(this).dialog("close");
}
4
JohnPan

Ich habe den gleichen Fehler in 1.10.2 erhalten. In meinem Fall wollte ich das aktuell sichtbare Dialogfeld durch Klicken auf die Hintergrundüberlagerung ausblenden, unabhängig davon, auf welchem ​​Element es basiert. Deshalb hatte ich folgendes: 

$('body').on("click", ".ui-widget-overlay", function () {
    $(".ui-dialog").dialog('destroy');
});

Früher funktionierte das, deshalb denke ich, dass sie in JQUI die Unterstützung für den Aufruf von .dialog () im Popup selbst entfernt haben müssen.

Meine Problemumgehung sieht folgendermaßen aus:

$('body').on("click", ".ui-widget-overlay", function () {
    $('#' + $(".ui-dialog").attr('aria-describedby')).dialog('destroy');
});
3

Ich bin über dasselbe gestolpert und wollte meine Lösung teilen:

<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>

da "dieses" auf ein Nicht-Dialog-Objekt verweist, wurde der genannte Fehler angezeigt.

Lösung:

<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>
1
osh

Ich hatte dieses Problem schon einmal, als ein Dialogfeld diesen Fehler auslöste, während alle anderen einwandfrei funktionierten. Die Antwort war, weil ich ein anderes Element mit der gleichen id="dialogBox" else ware auf der Seite hatte. Ich habe diesen Thread während einer Suche gefunden, also wird dies hoffentlich jemand anderem helfen.

1
Andrew Fox

Also benutzt du das:

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

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.

1

Dies geschah für mich, als mein ajax den Inhalt der Seite ersetzte und am Ende zwei Elemente derselben Klasse für den Dialog hatten, was bedeutete, dass meine Zeile, die den auf der CSS-Klassenselektor ausgeführten Dialog schließt, zwei Elemente fand, und nicht das der zweite war nie initialisiert worden.

$(".dialogClass").dialog("close"); //This line was expecting to find one element but found two where the second had not been initialised.

Für alle Benutzer von ASP.NET MVC ist dies der Fall, weil meine Controller-Aktion eine vollständige Ansicht einschließlich der freigegebenen Layoutseite zurückgegeben hat, die das Element enthielt, wenn es eine teilweise Ansicht hätte zurückgeben sollen, da das Javascript nur den Hauptinhaltsbereich ersetzt hat.

1
Alan Macdonald

Diese Fehlermeldung wurde angezeigt, als ich versuche, das Dialogfeld mithilfe einer Schaltfläche im Dialogfeldkörper zu schließen. Ich habe versucht, $('#myDialog').dialog('close'); zu verwenden, was nicht funktioniert hat.

Am Ende habe ich die Klick-Aktion der "x" -Schaltfläche in der Kopfzeile ausgelöst:

$('.modal-header:first').find('button:first').click();  
0
Crackerjack

Erstellen Sie eine separate JavaScript-Funktion, die aufgerufen werden kann, um das Dialogfeld mithilfe der spezifischen Objekt-ID zu schließen, und platzieren Sie die Funktion wie folgt außerhalb von $(document).ready():

function closeDialogWindow() { 
$('#dialogWindow').dialog('close');
}

HINWEIS: Die Funktion muss außerhalb von $(document).ready() deklariert werden, damit jQuery nicht versucht, das Ereignis close im Dialogfeld auszulösen, bevor es im DOM erstellt wird.

0
John Verco

Ich hatte ein ähnliches Problem, das ich durch Definieren meines Button-Arrays außerhalb der Dialogdeklaration beheben konnte.

var buttonArray = {};
buttonArray["Ok"] = function() { $( this ).dialog( "close" );}

Ihre Optionen würden zu:

modal: true,
autoOpen: false,
buttons: buttonArray
0
stead

ich habe das gleiche Problem, ich öffne mehrere Dialoge. Mein Problem war, was der Inhalt entfernt werden sollte, damit die Formulardaten nicht mit den gleichen Daten bleiben. Dann werden diese Parameter erstellt

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();
        }
    });

und der Dialog wird als Parameter an die Funktion übergeben, um die Aktion auszuführen:

    function functionCall(dialogFormulario,var1,var2)
{
    //same action 
        dialogFormulario.dialog("close");

}

Hier ist es nur erforderlich, .dialog ("close") und kein .dialog ("destroy") zu verwenden, da der Dialog seine Funktion close aufrufen wird und das Element nicht vorhanden ist

0
KristKing

Nach einer Stunde fand ich die beste Annäherung. Wir sollten das Ergebnis des Dialogs in Variable speichern, danach die close-Methode der Variablen aufrufen.

So was:

var dd= $("#divDialog")
.dialog({
   height: 600,
   width: 600,
   modal: true,
   draggable: false,
   resizable: false
});

// . . .

dd.dialog('close');
0
Hamed Khatami

Ich weiß, dass dies sehr alt ist, aber ich habe das gleiche Problem, als ich durch eine Winkelroute navigieren musste und der Dialog geöffnet ist, er blieb offen. Daher habe ich eine Problemumgehung zum Aufrufen der close-Methode im Route-Controller-Destruktor. Habe aber diesen oben genannten Fehler, wenn der Dialog nicht geöffnet war. Wenn Sie also den Dialog vor der Initialisierung schließen, tritt dieser Fehler auf. Um zu überprüfen, ob das Dialogfeld geöffnet ist, schließen Sie es und schließen Sie es in diesem Zustand.

if($('#mydialog').dialog('isOpen')) { //close dialog code}
0
Sahib Khan

Senguttuvan: Ihre Lösung war das Einzige, was für mich funktionierte.

funktion btnClose () { 
$ (". ui-dialog-titlebar-close"). trigger ('click'); 
}

0
user1229595

Möglicherweise möchten Sie den Schaltflächeninhalt außerhalb des Dialogfelds deklarieren. Dies funktioniert bei mir.

var closeFunction = function() {
    $(#dialog).dialog( "close" );
};

$('#dialog').dialog({
    modal: true,
    buttons: {
        Ok: closeFunction
    }
});
0
jpotterh

Ich hatte ein ähnliches Problem und in meinem Fall war das Problem anders (ich verwende Django-Vorlagen). 

Die Reihenfolge von JS war anders (ich weiß, das ist das erste, was du überprüfst, aber ich war fast sicher, dass das nicht der Fall war, aber es war so). Das js, das den Dialog aufruft, wurde aufgerufen, bevor die jqueryUI-Bibliothek aufgerufen wurde.

Ich benutze Django, also erbte ich eine Vorlage und verwende {{super.block}}, um Code auch vom Block an die Vorlage zu erben. Ich musste {{super.block}} am Ende des Blocks verschieben, wodurch das Problem gelöst wurde. Das js, das den Dialog aufruft, wurde in Djangos admin.py in der Media-Klasse deklariert. Ich habe mehr als eine Stunde gebraucht, um das herauszufinden. Hoffe das hilft jemandem.

0
Anupam