Created
August 26, 2011 01:36
-
-
Save kmiyashiro/1172487 to your computer and use it in GitHub Desktop.
ender issues with backbone events
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var PageView = Backbone.View.extend({ | |
| el: '#content', | |
| template: _.template($('#page-template').html()), | |
| events: { | |
| 'click #back' : 'back', | |
| 'click #forward' : 'forward', | |
| 'click #side' : 'side' | |
| }, | |
| initialize: function() { | |
| // constructor | |
| this.render(); | |
| }, | |
| render: function() { | |
| $(this.el).html(this.template(this.model.toJSON())); | |
| return this; | |
| }, | |
| back: function(e) { | |
| console.log('back'); | |
| }, | |
| forward: function(e) { | |
| console.log('forward') | |
| }, | |
| side: function(e) { | |
| console.log('side') | |
| } | |
| }); | |
| var pagemodel = new Page(); | |
| var newpage = new PageView({ model: pagemodel}); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>MTest</title> | |
| <link rel="stylesheet" href="styles/screen.css" type="text/css" media="screen" title="" charset="utf-8"> | |
| </head> | |
| <body> | |
| <!-- Might want to make this a template and change it for each sub section and to display status --> | |
| <div id="page" class="page"> | |
| <header> | |
| <h1>Test</h1> | |
| </header> | |
| <div id="content"></div> | |
| </div> | |
| <script src="ender.js" type="text/javascript" charset="utf-8"></script> | |
| <script type="text/javascript" charset="utf-8"> | |
| var Backbone = require('backbone'), | |
| _ = require('underscore'); | |
| </script> | |
| <script id="page-template" type="text/template" charset="utf-8"> | |
| <h2><%= name %></h2> | |
| <p>I'm template content!</p> | |
| <button id="back" value="back">Back</button> | |
| <button id="forward" value="forward">Forward</button> | |
| <button id="side" value="side">Side</button> | |
| </script> | |
| <!-- Views --> | |
| <script src="page.js" type="text/javascript" charset="utf-8"></script> | |
| <script src="app.js" type="text/javascript" charset="utf-8"></script> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var Page = Backbone.Model.extend({ | |
| defaults: { | |
| name: 'New page', | |
| href: '/', | |
| templateUrl: null, | |
| active: false | |
| }, | |
| initialize: function(config) { | |
| } | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
There are three events in the view, back, forward, and side. Only the first event is ever attached to its element.