Bootbox: функция обратного вызова после закрытия диалогового окна / нажатия кнопки «X»

Следующий фрагмент позволяет мне выполнять действия в функции обратного вызова для нажатых кнопок. Однако как я могу получить функцию обратного вызова или аналогичный обходной путь, чтобы я мог выполнять некоторый код, когда пользователь нажимает кнопку «X» / закрывает диалоговое окно?

    bootbox.dialog({
        title: "Woah this acts like an alert",
        message: "Cool info for you. You MUST click Ok.",
        buttons: {
            sucess:{
                label: "Ok",
                callback: callback
            }
        }       
    });

   callback(){//stuff that happens when they click Ok.}

Я не хочу отключать/скрывать кнопку закрытия с помощью

closeButton: false,

javascript twitter-bootstrap callback bootbox
person Null Reference    schedule 18.03.2015    source источник
comment
Вы проверили пример на их странице? Найдите Prompt with default value Или вы можете использовать $("#myModal").on("hidden", function() { //do something });   -  person anpsmn    schedule 18.03.2015
comment
Хм, похоже, не работает вместе с пользовательским диалогом   -  person Null Reference    schedule 18.03.2015

Ответы (3)


arrow_upward
13
arrow_downward

Для этого есть функция onEscape.

bootbox.dialog({
    message: 'the msg',
    title: "Title",
    onEscape: function() {
        // you can do anything here you want when the user dismisses dialog
    }
});
person Haris ur Rehman    schedule 25.06.2015
comment
Это не срабатывает при нажатии на X, только при нажатии клавиши esc. ответ anpsmn работает для обоих. - person Felix Böhme; 14.04.2016

arrow_upward
6
arrow_downward

Вы можете использовать переменную, чтобы проверить, было ли модальное окно скрыто после нажатия на OK или x button / escape key.

var status = false;

$('.btn').on('click', function () {
    bootbox.dialog({
        title: "Woah this acts like an alert",
        message: "Cool info for you. You MUST click Ok.",
        buttons: {
            sucess: {
                label: "Ok",
                callback: function () {
                    status = true;
                }
            }
        },
        onEscape: function () {
            $('.bootbox.modal').modal('hide');
        }
    });
});

$(document).on("hidden.bs.modal", ".bootbox.modal", function (e) {
    callback();
});


function callback() {
    if (!status) {
        onClose();
    } else {
        onOK();
        status = false;
    }
}

function onClose() {
    $('p.alert span').removeClass().addClass('text-danger').text("Dismissed");
}

function onOK() {
    $('p.alert span').removeClass().addClass('text-success').text("Sucess");
}

демонстрация скрипта

person anpsmn    schedule 18.03.2015

arrow_upward
1
arrow_downward

Некоторые люди могут посчитать это чем-то вроде взлома. Хотя меня это вполне устраивает, так как все, что я хотел подтвердить как разработчику, что кто-то принял сообщение, которое вызвало следующее событие.

Использование Bootbox.js' собственного метода confirm(), который действительно предоставляет действие callback. Я добавил дополнительный класс в качестве опции к кнопке confirm (которая должна предоставляться при вызове confirm()) с именем класса hidden (например, в Bootstap есть вспомогательный класс для display:none, который называется hidden.

Это скрывает кнопку подтверждения, поэтому модальное окно отображается как обычное окно предупреждения.

    bootbox.confirm({ 
        message: "Some Button Text", 
        buttons: {
            "cancel": {
                label: "<i class='fa fa-check'></i> OK - I understand",
                className: "btn btn-primary"
            },
            //Hide the required confirm button.
            "confirm": { label: "", className: "hidden" }
        },
        callback: function(){
            //Begin Callback
            alert( "Finished" );
        }
    });

Пример JsFiddle

person MackieeE    schedule 03.04.2017
comment
Я нашел этот ответ весьма полезным для меня сегодня, так как этот фрагмент кода "confirm": { label: "", className: "hidden" } где на всю жизнь не мог заставить кнопку подтверждения не отображаться. Я так не парень JS, и поиск в Google привел меня сюда. Просто подумал, что тебе может быть интересно это узнать. - person Funk Forty Niner; 10.04.2018