Come chiudere il bootbox quando si usa la finestra di dialogo personalizzata

Question

Sto usando bootbox per mostrare la finestra di dialogo.

Se uso bootbox.confirm, bootbox.alert o bootbox.prompt, quando si preme escape tasto o facendo clic al di fuori della finestra di dialogo, la finestra chiusa come previsto

ma quando si utilizza bootbox.dialog, quando si fa clic al di fuori della finestra o premendo escape chiave, la finestra di dialogo non chiude, come si comporta come fa un altro dialogo?

var box = bootbox.dialog({ 
    show: false, 
    backdrop: true, 
    animate: false, 
    title: 'Bla', 
    message: 'bla bla bla', 
    buttons: { 
     cancel: { 
      label: 'Cancel', 
      className: 'btn-warning' 
     }, 
     save: { 
      label: 'Parse', 
      className: 'btn-success', 
      callback: function() { 
       // handling with ajax 
       return false; 
      } 
     } 
    } 
}); 
box.modal('show'); 

Answer 1

Questo dovrebbe farlo. Si prega di notare che questo è stato testato solo su v3. utilizzando bootstrap 2.3.2

$(document).on('click', '.modal-backdrop', function (event) { 
    bootbox.hideAll() 
}); 

Answer 2

Per essere onesti non ho mai usato davvero modali - è venuto da un PR molto, molto tempo fa, ma non sono mai stato convinto della sua caso d'uso. Non ti va bene ora ma il metodo è in realtà commentato come deprecato nella v3.0.0 e probabilmente verrà rimosso nelle versioni future - non è proprio adatto (per me) a quale Bootbox è stato creato e come altri metodi sono stati ottimizzato, migliorato e testato è rimasto lì un po 'trascurato.

Ma si può fare qualcosa di simile

$(document).keyup(function(e) { 
    if (e.keyCode == 27) {box.modal("hide");} // esc 
}); 

Answer 3

Aggiungere una funzione onEscape callback, che può avere un corpo vuoto.

Vedere docs and example.

codice di base:

bootbox.dialog({ 
    onEscape: function() {}, 
    // ... 
}); 

Answer 4

Nella versione 3, con finestra, fondale essendo vere e proprie opere solo quando onEscape è vero, come pure - in modo che solo bisogno di impostare sia true, ad esempio,

bootbox.dialog({message:'Message', title:'Title', backdrop:true, onEscape:true})

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"></script>