Skip to content
Advertisement

Calling a function on Bootstrap modal open

I used to use jQuery UI’s dialog, and it had the open option, where you can specify some Javascript code to execute once the dialog is opened. I would have used that option to select the text within the dialog using a function I have.

Now I want to do that using bootstrap’s modal. Below is the HTMl code:

JavaScript

And as for the button that opens the modal:

JavaScript

I tried to use an onclick listener of the button, but the alert message was displayed before the modal appeared:

JavaScript

Advertisement

Answer

You can use the shown event/show event based on what you need:

JavaScript

Demo: Plunker

Update for Bootstrap 3 and 4

For Bootstrap 3.0 and 4.0, you can still use the shown event but you would use it like this:

JavaScript

See the Bootstrap 3.0 docs here under “Events”.

Advertisement