How to trigger a custom event with Meteor js

Question

Is it possible to trigger a custom event with Meteor? I see that triggering custom jquery events doesn't work, since the Meteor events are separate from jQuery (as discussed here).

So if I had something like:

Template.foo.events({
    'mouseenter .box, makeSelected .box': function() { ... }
})

It'd be nice if I could do something along the lines of:

Meteor.trigger($('.box')[0], 'makeSelected')

My current workaround is to just store the id that I want as data-id="{{_id}}" on the dom element and then use that to modify a key in the Session, but being able to trigger the event feels more "DRY".

Answer 1

Meteor doesn't seem to support custom events at the moment, but you can always just use jQuery (or whatever you want) to create custom events, and then make sure they're re-attached to their respective elements with the rendered event on Templates:

Template.foo.rendered = function() {
  attachEvents();
}

Answer 2

Apparently this now works using jQuery event triggering and standard Meteor event listening syntax. Looking at the code for the Bootstrap carousel, it emits a custom jQuery event by doing the following:

var slideEvent = $.Event('slide.bs.carousel', {
    // event state
})
this.$element.trigger(slideEvent)

I sucessfully listened to this event by doing:

Template.carousel.events({
    'slide.bs.carousel': function (event, template) {
        // event handler code here...
    }
});

I was pleasantly surprised at how easily the Bootstrap (jQuery) events meshed with Meteor.