PH.
PH.

Reputation: 606

Extending Twitter Bootstrap's Modal Plugin

I am trying to extend the Twitter Bootstrap's Modal Plugin. Is there a clean way to trigger an action when a modal popup is shown and hidden.

$("#xyz").clone().modal({"backdrop": "static", "keyboard":true, "show":true});
$("#xyz").on("shown", function(e){ console.log("hi");});

Tried the above but does nothing.

I don't want to specify the above function for all modal calls in my code. What I really want is to make a generic function for all modal whenever shown or hidden.

Thanks!

Upvotes: 1

Views: 312

Answers (1)

jackwanders
jackwanders

Reputation: 16030

Your code isn't working because you're attaching the event handler to $('#xyz'), but you're creating a modal from $('#xyz').clone(), which is a separate object.

Try:

$("#xyz").on("shown", function(e){ console.log("hi");});
$("#xyz").clone(true).modal({"backdrop": "static", "keyboard":true, "show":true});

Attach the event handler first, and then clone it, making sure to pass true as an argument so that all event handlers and data attached to $('#xyz') are passed to the cloned object.

Upvotes: 2

Related Questions