how to capture bootstrap modal open/close event in meteor js

Question

I am trying to capture bootstrap modal open/close event in meteor js to do some custom checks. I know how to do it in jquery:

$('#videoCallModal').on('shown.bs.modal', function () {
  // do something…
})

but since I also want to refer the context (this object), I want to do it in Template.template.events.

I tried something like, but the function was not invoked:

Template.videoCall.events = {
    'on #videoCallModal shown.bs.modal': function(e){
        e.preventDefault();

        console.log("modal open", this);
    }
}

Is there any other way to capture the close/open of modal in meteor js

Answer 1

The correct syntax is:

Template.videoCall.events({
  'shown.bs.modal #videoCallModal': function(e){
    /* ... */
  }
});

See this meteorpad.

Answer 2

I created peppelg:bootstrap-3-modal to provide a simple way to handle modals in Meteor. With it, you can use the created and destroyed callbacks (just as your used to in Meteor!), instead of the open and close events.