CODEWITHSUNDEEP
jquerybootstrap5-modal
Mervin Separa
Mervin Separa

Reputation: 31

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

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.

Upvotes: 3

Views: 1848

Answers (3)

Alvin Ardiansyah Maulana
Alvin Ardiansyah Maulana

Reputation: 21

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');

Upvotes: 2

Lakshyaraj Dash
Lakshyaraj Dash

Reputation: 153

Use vanilla javascript instead

const modal = new bootstrap.Modal('#myModal')
// Show the modal
// modal.show();

// Hide the modal
modal.hide();

Upvotes: 0

JDawwgy
JDawwgy

Reputation: 928

using .modal() might work better for you!

$('#myModal').modal({backdrop:'static', keyboard:false});

Upvotes: 0

Related Questions