Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Change Bootstrap modal option once it already exists

I'm using Bootstrap Modal. I declare it, I call it, I show it...everything seems to be ok.

But what if I have an already existing modal previously shown with "keyboard" property to false and I want to change it on the go? I mean something like:

First, I create a Modal doing this (as you can see, I declare the modal putting keyboard property to false):

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

But then I declare this event handler, that means that if "something" happens, I want the keyboard property to be set to true.

 $('#myModal').on('shown', function(e) {     if (something){         $('#myModal').modal({keyboard: true});     }  } 

So, when I go

$("#myModal").show(); 

The event handler is not doing what it is supposed to, as I am not getting to close the modal once Escape key is pressed. But I am completely sure that "something" is true and I have checked and re-checked that $('#myModal').modal({keyboard: true}) is executed.

Any clue as to why this isn't updating the value of configuration option?

like image 963
ElPiter Avatar asked Aug 04 '12 07:08

ElPiter


1 Answers

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

like image 55
4 revs, 2 users 82% Avatar answered Oct 14 '22 13:10

4 revs, 2 users 82%