How to handle custom jQuery events in Meteor?

Question

In Metor 0.3.5, when all events were jQuery events, I was able to use use jQuery UI Draggable and then handle the drag & dragstop events using a Metor event map:

Template.game.events['dragstop .card'] = function (e) {
    //stuff
};

But I just read this in the Meteor mailing list:

In 0.3.6, event maps no longer depend on jQuery

And sure enough, the above technique no longer seems to work – my dragstop handler isn't called at all now.

I'd greatly appreciate any advice as to how to achieve the same effect in 0.3.6.

We don't have a story yet for drag-and-drop or interoperation with jQuery UI plug-ins, but we will look into it! A workaround could be to bind the listener using jQuery instead of an event map. — dgreensp, May 22 '12 at 19:28
@dgreensp Is there any disadvantage to bypassing event maps (aside from having to manually hook up the listeners w/ jQuery's [`on`](http://api.jquery.com/on/) function)? — Emmett, May 22 '12 at 20:06

score 5 · Answer 1 · answered Nov 18 '14 at 23:00

5

Nowadays, you can simply use body events to accomplish this the "Meteor" way:

Template.body.events({
    'dragstop #somedivid': function(e) {
        // Do stuff
    }
});

answered Nov 18 '14 at 23:00

occasl

And can't get this to work for some reason. Is that still a valid answer? – Billybobbonnet Aug 19 '15 at 11:20
Yes, it works as of Meteor 1.2. What issue are you having? – occasl Nov 18 '15 at 04:29

score 3 · Accepted Answer · answered May 24 '12 at 04:23

3

Custom jQuery events can be bound with plain old jQuery, bypassing event maps altogether:

$(function () {
    $('body').on('dragstop', '.card', function (e) {
        //stuff
    });
});

Remember to use jQuery's on function to bind the handlers, since template elements are not necessarily included in the DOM at all times.

answered May 24 '12 at 04:23

Emmett

2

Don't `.on` works for non-existent DOM elements just when it is bind on `document`? So `$(document).on(events, selector, callback)`? Like `.live` was in previous jQuery API? – Mitar Mar 31 '13 at 23:03

2 Answers2