How Do I Call A Function When Bootstrap Collapse Expands

I want to activate this javascript: jsPlumb.repaintEverything(); ...and fire up an alert box saying 'I'm expanding!!!' when a user clicks the button in this fiddle Does anyone kn

Solution 1:

You can use the shown.bs.collapse event that Bootstrap raises:

$('#demo').on('shown.bs.collapse', function() {
    jsPlumb.repaintEverything();
});

Updated fiddle

Note that this event fires after the element expansion animation has completed. If you want to run the code as the animation starts, use show.bs.collapse instead

Solution 2:

You have two events in Bootstrap that supports your requirement.

show.bs.collapse - This event fires immediately when the show instance method is called. shown.bs.collapse - This event is fired when a collapse element has been made visible to the user (will wait for CSS transitions to complete).

fire up an alert box saying "I'm expanding!!!"

So what you need is show.bs.collapse which is triggered just before the the div is shown

$('#demo').on('show.bs.collapse', function() {
    jsPlumb.repaintEverything();
});