web-dev-qa-db-fra.com

Bootbox: fonction de rappel après avoir fermé la boîte de dialogue/Cliquer sur le bouton 'X'

L'extrait suivant me permet d'effectuer des opérations dans une fonction de rappel pour les boutons sur lesquels vous cliquez. Cependant, comment puis-je obtenir une fonction de rappel ou une solution de contournement similaire telle que je puisse exécuter du code lorsqu'un utilisateur clique sur le bouton "X"/ferme la boîte de dialogue?

    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.}

Je ne veux pas désactiver/cacher le bouton de fermeture avec 

closeButton: false,
javascripttwitter-bootstrapcallbackbootbox
7
Null Reference

Il existe une fonction onEscape pour cela.

bootbox.dialog({
    message: 'the msg',
    title: "Title",
    onEscape: function() {
        // you can do anything here you want when the user dismisses dialog
    }
});
11
Haris ur Rehman

Vous pouvez utiliser une variable pour vérifier si le modal a été masqué après un clic sur OK ou 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");
}

Fiddle démo

6
anpsmn

Certaines personnes pourraient voir cela comme un peu un bidouillage. Bien que cela me convienne, tout ce que je voulais reconnaître en tant que développeur, c'est que quelqu'un ait accepté le message, ce qui a déclenché l'événement suivant.

En utilisant la méthode Bootbox.js 'native confirm() qui fait fournit une action callback. J'ai ajouté une classe supplémentaire en option au bouton confirm (que doit être fourni lors d'un appel confirm()) avec le nom de classe hidden (E.g. Bootstap a une classe d'assistance pour display:none appelée hidden. 

Cela masque le bouton de confirmation, ainsi le modal apparaît comme une boîte d’alerte normale.

    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" );
        }
    });

Exemple JsFiddle

1
MackieeE