How to dynamically update an open Bootstrap 5 modal backdrop and keyboard properties

Question

I have Bootstrap 5 modal that is displayed. I wish to dynamically change it's backdrop and keyboard so that for a specific action i.e. button press, the modal will stay static. This code does not work:

bModal = bootstrap.Modal.getOrCreateInstance(parent.jQuery('.modal'));
bModal._config.keyboard = false;
bModal._config.backdrop = "static";

I checked console.log I can confirm that I am targetting the correct modal but for some reason the config does not stay static.

Any assistance would be appreciated.

Answer 1

i think you should refer to first index

const $modal = jQuery('.modal')[0];
let modalInstance = bootstrap.Modal.getInstance($modal);

modalInstance._config.backdrop = false;
modalInstance._config.keyboard = false;

in vanilla it's equivalent to

document.getElementByClass('modal');