jquery ui Dialog: non è possibile chiamare metodi nella finestra di dialogo prima dell'inizializzazione

Ho un'app su jquery 1.5 con finestre di dialogo che hanno funzionato bene. Anche se ho molti gestori .live, l'ho cambiato in .on. Per questo, devo aggiornare jquery (ora 1.8.3 un jquerui 1.9.1).

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

Di seguito è riportato il codice:

Javascript

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

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

codice html

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

Qualche idea del perché potrebbe succedere?

Prova questo invece

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

Puoi anche fare:

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

Questo perché la finestra di dialogo non è memorizzata in $('#divDialog'), ma su un nuovo div creato al volo e restituito dalla .dialog(opt)funzione.

Se non riesci ad aggiornare jQuery e ottieni:

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

Puoi aggirarlo in questo modo:

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

Oppure, se controlli la visualizzazione e sai che nessun'altra finestra di dialogo dovrebbe essere in uso sull'intera pagina, potresti fare:

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

Consiglierei di farlo solo se l'utilizzo closestcausa un problema di prestazioni. Probabilmente esistono altri modi per aggirare il problema senza eseguire una chiusura globale in tutte le finestre di dialogo.

Ho ricevuto questo errore quando ho aggiornato solo la libreria jquery senza aggiornare la libreria jqueryui in parallelo. Stavo usando jquery 1.8.3 con jqueryui 1.9.0. Tuttavia, quando ho aggiornato jquery 1.8.3 a 1.9.1 ho ricevuto l'errore sopra. Quando ho commentato le .closerighe del metodo incriminato , ha generato un errore di non ricerca.browsernella libreria jquery che era deprecata in jquery 1.8.3 e rimossa da jquery 1.9.1. Quindi, in sostanza, la libreria jquery 1.9.1 non era compatibile con la libreria jquery ui 1.9.0 nonostante la pagina di download dell'interfaccia utente jquery affermasse che funziona con jquery 1.6+. Essenzialmente, ci sono bug non segnalati quando si cerca di utilizzare versioni diverse dei due. Se utilizzi la versione jquery fornita in bundle con il download di jqueryui, sono sicuro che starai bene, ma è quando inizi a utilizzare versioni diverse che esci dai sentieri battuti e ricevi errori come questo. Quindi, in sintesi, questo errore proviene da versioni non corrispondenti (nel mio caso comunque).

Quindi usi questo:

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

e se apri una vista parziale MVC nella finestra di dialogo, puoi creare nell'indice un pulsante nascosto e un evento clic JQUERY:

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

quindi all'interno della visualizzazione parziale html chiami il pulsante di attivazione del pulsante come:

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

ci vediamo.

Se vuoi aprire la finestra di dialogo immediatamente quando la finestra di dialogo è inizializzata o la pagina è pronta, puoi anche impostare il parametro autoOpensu truenell'oggetto opzioni della finestra di dialogo:

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

Quindi, non è necessario chiamare la finestra di dialogo `$ (" # divDialog "). (" Open ");

Quando l'oggetto di dialogo viene inizializzato, la finestra di dialogo viene aperta automaticamente.

La nuova versione dell'interfaccia utente di jQuery non ti consentirà di chiamare i metodi dell'interfaccia utente su una finestra di dialogo non inizializzata. Come soluzione alternativa, puoi utilizzare il controllo seguente per vedere se la finestra di dialogo è attiva.

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

Questo è anche un modo per aggirare:

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

Ho semplicemente dovuto aggiungere lo ScriptManager alla pagina. Problema risolto.

Nel mio caso il problema era che avevo chiamato $("#divDialog").removeData();come parte del ripristino dei dati dei moduli all'interno della finestra di dialogo.

Ciò ha comportato la cancellazione di una struttura dati denominata, il uiDialogche significava che la finestra di dialogo doveva essere reinizializzata.

Ho sostituito .removeData()con eliminazioni più specifiche e tutto ha ripreso a funzionare.

Il mio caso è diverso, fallisce a causa dell'ambito di " questo ":

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

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

Ho ricevuto questo messaggio di errore perché avevo il tag div nella vista parziale invece della vista principale