diff --git a/docs/client/api.html b/docs/client/api.html index 2598005db8..d8a5ae87bd 100644 --- a/docs/client/api.html +++ b/docs/client/api.html @@ -901,11 +901,11 @@ Example: "selected" : ""; }; - Template.post_item.events = { + Template.post_item.events({ 'click': function() { Session.set("selected_post", this._id); } - }; + }); // Using Session.equals here means that when the user clicks // on an item and changes the selection, only the newly selected diff --git a/docs/client/concepts.html b/docs/client/concepts.html index b76f6614b1..785ebde278 100644 --- a/docs/client/concepts.html +++ b/docs/client/concepts.html @@ -387,7 +387,7 @@ Helpers can also be used to pass in constant data. // Works fine with {{dstache}}#each sections}} Template.report.sections = ["Situation", "Complication", "Resolution"]; -Finally, you can set the `events` property of a template function to a +Finally, you can use an `events` declaration on a template function to set up a table of event handlers. The format is documented at [Event Maps](#eventmaps). The `this` argument to the event handler will be the data context of the element that triggered the event. @@ -406,11 +406,11 @@ the data context of the element that triggered the event. - Template.player_score.events = { + Template.player_score.events({ 'click .give_points': function () { Users.update({_id: this._id}, {$inc: {score: 2}}); } - }; + }); Putting it all together, here's an example of how you can inject arbitrary data into your templates, and have them update automatically diff --git a/examples/wordplay/client/wordplay.js b/examples/wordplay/client/wordplay.js index 3b7e62101d..e9d22c2708 100644 --- a/examples/wordplay/client/wordplay.js +++ b/examples/wordplay/client/wordplay.js @@ -90,7 +90,7 @@ Template.lobby.disabled = function () { }; -Template.lobby.events = { +Template.lobby.events({ 'keyup input#myname': function (evt) { var name = $('#lobby input#myname').val().trim(); Players.update(Session.get('player_id'), {$set: {name: name}}); @@ -98,7 +98,7 @@ Template.lobby.events = { 'click button.startgame': function () { Meteor.call('start_new_game'); } -}; +}); ////// ////// board template: renders the board and the clock given the @@ -130,13 +130,13 @@ Template.board.clock = function () { return min + ':' + (sec < 10 ? ('0' + sec) : sec); }; -Template.board.events = { +Template.board.events({ 'click .square': function (evt) { var textbox = $('#scratchpad input'); textbox.val(textbox.val() + evt.target.innerHTML); textbox.focus(); } -}; +}); ////// ////// scratchpad is where we enter new words. @@ -146,7 +146,7 @@ Template.scratchpad.show = function () { return game() && game().clock > 0; }; -Template.scratchpad.events = { +Template.scratchpad.events({ 'click button, keyup input': function (evt) { var textbox = $('#scratchpad input'); // if we clicked the button or hit enter @@ -165,17 +165,17 @@ Template.scratchpad.events = { set_selected_positions(textbox.val()); } } -}; +}); Template.postgame.show = function () { return game() && game().clock === 0; }; -Template.postgame.events = { +Template.postgame.events({ 'click button': function (evt) { Players.update(Session.get('player_id'), {$set: {game_id: null}}); } -} +}); ////// ////// scores shows everyone's score and word list.