jQuery UI - Dialog nidificate z-index emette

Question

ho ricevuto una finestra di dialogo che mostra un tavolo, e quando clicco su un pulsante "Elimina", mi si aprirà un'altra finestra per chiedere conferma. Attualmente questo funziona bene alla prima volta, ma se fa clic sul pulsante "Elimina" per la seconda volta, la finestra di dialogo di eliminazione è mostrato dietro la prima tabella di dialogo, quindi in realtà è invisibile per l'utente.

ho cercato di impostare lo z-index per entrambi finestra di dialogo, ma non so il motivo per cui si sta lavorando solo alla prima volta

seguito è il campione del mio script:

// The 1st dialog 
    var $detaildialog = $('#tableplaceholder').dialog({ 
     autoOpen: false, 
     modal: true, 
     width: '800', 
     height: 'auto' 

    }); 
    // Some steps to set the url.. then open the dialog 
    $detaildialog.load(url, function() { 

      $('#loading').hide(); 
      $detaildialog.dialog('open'); 
     }); 

    // Then, when delete action is called, open the second dialog 
    fnOnDeleting: function (tr, id, fnDeleteRow) { 
      var $dialog = $('#checkdeletedialog').dialog({ 
       autoOpen: false, 
       modal: true, 
       title: 'Delete Confirmation', 
       zIndex: 90000 
      }); 
      $dialog.dialog('open'); 
     } 

Qualcosa che sto facendo di sbagliato qui?

Apprezzo tutto l'aiuto .. grazie :)

Answer 1

Impostare la proprietà "stack" della seconda finestra su true.

function (tr, id, fnDeleteRow) { 
     var $dialog = $('#checkdeletedialog').dialog({ 
      autoOpen: false, 
      modal: true, 
      stack: true, 
      title: 'Delete Confirmation' 
     }); 
     $dialog.dialog('open'); 
    } 

here.

EDIT: Abbiamo anche avuto problemi con i dialoghi modali che si comportavano in modo strano dopo l'apertura una volta. Abbiamo scoperto che "distruggere" la finestra di dialogo quando si chiude risolve il problema, ad es.

var $dialog = $('#checkdeletedialog').dialog({ 
     autoOpen: false, 
     modal: true, 
     stack: true, 
     title: 'Delete Confirmation', 
     close: function() { 
      $(this).dialog('destroy'); 
     } 
    });