Bootstrap show.bs.modal / Datepicker show.bs.modal conflict

Hi,

I found some weird behaviour when using Datepicker inside a Bootstrap v3 Modal.

I have something like this

$("#my-modal").on("show.bs.modal", function() {
    // reset my values
});

$("#my-datepicker").datepicker();

Everytime I click on a datepicker input my “reset my values” code gets executed I found a solution here: http://stackoverflow.com/a/20059099/1909698

Which means my code works after adding:

$("#my-modal").on("show.bs.modal", function() {
    // reset my values
});

$("#my-datepicker").datepicker().on('show.bs.modal', function(event) {
    // prevent datepicker from firing bootstrap modal "show.bs.modal"
    event.stopPropagation();
});

Is it a bug or a feature? 😉

[bioteck]

Using shown and hidden events instead of show and hide is not always possible. A better workaround is to check the event namespace:

modal.on('show.bs.modal', function(e) {
    if (e.namespace === 'bs.modal') {
        //
    }
});

[mrlinnth]

Just faced with this issue in past a couple of hours. We solved it by using “shown.bs.modal” instead of “show.bs.modal” on modal event.

$(“#my-modal”).on(“shown.bs.modal”, function() { // reset my values });