How to prevent Bootbox from displaying twice after a double click?

Question

I have a <ul> element that opens a bootbox when it's clicked. Double clicking this element triggers the onclick in JQuery twice

$("#email-list").on("click", ".list-group-item", function (e) {
bootbox.confirm("Send a forgotten password email to " + email + "?", function (result) {...}}

I tried using 'e.preventDefault()'

$(document).ready(function () {

    $("#email-list").dblclick(function (e) {

        e.preventDefault();
    });

});

I even tried disabling clicking on the element but both failed. The bootbox still appears twice.

$("#email-list").bind('click', function () { return false; });
//...do stuff
$("#email-list").unbind('click');

Anyone has a suggestion?

Answer 1

Another solution can be to add:

bootbox.hideAll();

to hide any other bootboxes right before showing the bootbox like so:

bootbox.hideAll();
bootbox.confirm("Some Message " , function (result){/*do stuff*/}

Answer 2

Try this:

$("#email-list").on("click", ".list-group-item", function (e) {
   if(!$('#myModal').is(':visible')){
       $('#myModal').modal('show');  
   }
   e.preventDefault();
}