Change Bootstrap modal option once it already exists Change Bootstrap modal option once it already exists jquery jquery

Change Bootstrap modal option once it already exists


To change configuration settings on already initiated Bootstrap plugin, such as the Modal, you need to access the plugin object attached to the element, like $('#pluginElement').data['somePlugin'] and then set the options in it.

For the Modal, you need:

$('#myModal').data('modal').options.keyboard = true;

JSFiddle Demo (old)


For Bootstrap 3 (as mentioned in comments by @Gerald ), you need bs.modal:

$('#myModal').data('bs.modal').options.keyboard = true;

Waiting Modal Example


A bit beyond the scope of the OP, but this is now twice I have searched for the same solution (my memory is crap) and twice that I came across this question which led me to my eventual answer. My issue was how to make an already init'ed and displayed modal, which was "closeable", into an "uncloseable" model. In the rare even that another user needs this answer, here is what I did based on the accepted answer:

*bootstrap3 used

$('#modal').off('keyup.dismiss.bs.modal'); // disable escape key$('#modal').data('bs.modal').options.backdrop = 'static';$('#modal button.close').hide();

Notice that I didn't change the options.keyboard property to false (followed by calling escape()) as suggested above. I could not get that to work, so after looking the Bootstrap source, I saw that all it was doing was simply removing an event listener for 'keyup.dismiss.bs.modal'.

To re-enabled things (in my scenario, when the model is hidden):

$('#modal').on('hidden.bs.modal', function (e) {    $(this).data('bs.modal').escape(); // reset keyboard    $(this).data('bs.modal').options.backdrop = true;    $('button.close', $(this)).show();});

This seems COMPLETELY clumsy and will for sure break in coming versions of Bootstrap, but works for now...

Cheers :)


For bootstrap4

To disable closing modal on escape button:

$('#myModal').off('keydown.dismiss.bs.modal');

To disable closing modal on clicking on backdrop:

$('#myModal').data('bs.modal')._config.keyboard = false;

As warned by nocturnal, this may break in the future versions of bootstrap.