mirror of
https://github.com/rstudio/shiny.git
synced 2026-01-13 00:48:09 -05:00
d03ee36647
* Fixes #1427: add event delegation so that modal does not close when an element inside it is triggered as hidden * use `this === e.target` instead * added NEWS item * `e.target` must be equal to `$(#shiny-modal)`, not `this`
50 lines
1.7 KiB
JavaScript
50 lines
1.7 KiB
JavaScript
exports.modal = {
|
|
|
|
// Show a modal dialog. This is meant to handle two types of cases: one is
|
|
// that the content is a Bootstrap modal dialog, and the other is that the
|
|
// content is non-Bootstrap. Bootstrap modals require some special handling,
|
|
// which is coded in here.
|
|
show: function({ html='', deps=[] } = {}) {
|
|
|
|
// If there was an existing Bootstrap modal, then there will be a modal-
|
|
// backdrop div that was added outside of the modal wrapper, and it must be
|
|
// removed; otherwise there can be multiple of these divs.
|
|
$('.modal-backdrop').remove();
|
|
|
|
// Get existing wrapper DOM element, or create if needed.
|
|
let $modal = $('#shiny-modal-wrapper');
|
|
if ($modal.length === 0) {
|
|
$modal = $('<div id="shiny-modal-wrapper"></div>');
|
|
$('body').append($modal);
|
|
|
|
// If the wrapper's content is a Bootstrap modal, then when the inner
|
|
// modal is hidden, remove the entire thing, including wrapper.
|
|
$modal.on('hidden.bs.modal', function(e) {
|
|
if (e.target === $("#shiny-modal")[0]) {
|
|
exports.unbindAll($modal);
|
|
$modal.remove();
|
|
}
|
|
});
|
|
}
|
|
|
|
// Set/replace contents of wrapper with html.
|
|
exports.renderContent($modal, { html: html, deps: deps });
|
|
},
|
|
|
|
remove: function() {
|
|
const $modal = $('#shiny-modal-wrapper');
|
|
|
|
// Look for a Bootstrap modal and if present, trigger hide event. This will
|
|
// trigger the hidden.bs.modal callback that we set in show(), which unbinds
|
|
// and removes the element.
|
|
if ($modal.find('.modal').length > 0) {
|
|
$modal.find('.modal').modal('hide');
|
|
|
|
} else {
|
|
// If not a Bootstrap modal dialog, simply unbind and remove it.
|
|
exports.unbindAll($modal);
|
|
$modal.remove();
|
|
}
|
|
}
|
|
};
|