Search code examples
javascripttwitter-bootstrap-3modal-dialogbootbox

How to make bootbox closing when using custom dialog


I'm using bootbox to show dialog.

If I use bootbox.confirm, bootbox.alert or bootbox.prompt, when pressing escape key or clicking outside the dialog, the dialog closed as expected

but when using bootbox.dialog, when I click outside the dialog or pressing escape key, the dialog doesn't close, how to make it behave as other dialog do?

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');

Solution

  • This should do it. Please note this has only been tested on v3. using bootstrap 2.3.2

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