jquery ui finestra di dialogo si apre solo una volta

Question

Ho un pulsante che apre una finestra di dialogo quando si fa clic. La finestra di dialogo mostra un div che era nascosto

Dopo aver chiuso la finestra di dialogo facendo clic sull'icona X, la finestra di dialogo non può essere riaperta.

Answer 1

Scott Gonzalez (della UI team di jQuery) parla della ragione un sacco di persone hanno questo problema quando si comincia con jQuery UI in un recente post sul blog: http://blog.nemikor.com/2009/04/08/basic-usage-of-the-jquery-ui-dialog/

Un estratto:

il problema che gli utenti spesso incontrano con finestre di dialogo è che si cerca di un'istanza di un nuova finestra di dialogo ogni volta l'utente esegue una certa azione (generalmente cliccando al inchiostro o un pulsante ). Questo è un errore comprensibile perché a prima vista è sembra come chiamare .dialog() su un elemento è ciò che provoca la finestra di dialogo aperto. In realtà ciò che sta accadendo è che una nuova istanza di dialogo è stata creata e che l'istanza è che viene aperta immediatamente dopo l'istanziazione . Il motivo per cui la finestra di dialogo si apre è perché le finestre di dialogo hanno l'opzione autoapri , che per impostazione predefinita è true. Pertanto, quando un utente chiama .dialog() su un elemento due volte, la seconda chiamata viene ignorata perché la finestra di dialogo ha già creata per l'elemento .

Soluzione:

La semplice soluzione a questo problema è istanziare il dialogo con AutoOpen impostato su false e quindi chiamare .dialog ('aperto') nel gestore di eventi.

$(document).ready(function() { 
    var $dialog = $('<div></div>') 
     .html('This dialog will show every time!') 
     .dialog({ 
      autoOpen: false, 
      title: 'Basic Dialog' 
     }); 

    $('#opener').click(function() { 
     $dialog.dialog('open'); 
    }); 
}); 

Answer 2

Stai utilizzando la finestra di dialogo? Dovresti postare del codice in modo che possiamo vedere che cosa sta causando il tuo problema. Ma qui si indovina (perché ho fatto di recente lo stesso errore). Quando si utilizza la finestra di dialogo ui è necessario inizializzare la finestra di dialogo solo una volta.

$(document).ready(function() { 
    $('#dialog').dialog({ 
    autoOpen:false, 
    modal:'true', 
    width:450, 
    height:550 
    }); 
$('#MyButton').click(openDialog);  

}); 

Questo codice, inizializza la finestra di dialogo, ma non lo mostra. La funzione openDialog aprirà la finestra di dialogo quando si fa clic su MyButton.

var openDialog = function(){ 

     $('#dialog').load('loadurl.php');//load with AJAX 

     //optionally change options each time it is clicked 
     $('#dialog').dialog('option', 'buttons',{ 
      "Cancel":function(){ 
      $('#dialog').dialog('close'); 
      } 
     }); 

    //actually open the dialog 
    $('#dialog').dialog('open'); 

}; 

Answer 3

In aggiunta alla risposta accettata vorrei aggiungere che è necessario prestare attenzione quando si utilizza questo in un UpdatePanel asp.net. Se si fa clic sul pulsante, si verificherà un postback, il popup si aprirà ma non si aprirà una seconda volta a causa del postback che si è verificato. Quindi dovresti assicurarti che il pulsante che usi per aprire il popup non sia postback. cioè:?. Codice

<asp:LinkButton ID="btn1" runat="server" OnClientClick="return false;">Click me</asp:LinkButton>