codeninjasllc/codecombat
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
Page: Add events to a view
Pages
Access dev database Access power user features Access url params in a view Accessing data through data attribute Add a Mongoose Model Add a collection schema Add a collection Add a form Add a route Add a view Add basic REST endpoints for a collection Add events to a view Add methods for special server endpoints Add space between elements Adventurer Home Aether Ambassador Home Archmage Home Artisan Home Artisan How To Index Autocomplete Tuning Building A Level Call server from view Change player level Chat Room Rules Chat Room Chief Artisan Level Audition Client models Coco Models Coding Guidelines for Artisans Coding Guidelines Component Authoring Guide Component Components And Systems Tabs Connect Backbone to new collection Cookbook Debug a template Dev Setup: General Information Dev Setup: Issues Dev Setup: Linux Dev Setup: Mac Dev Setup: Vagrant Dev Setup: Windows Developer organization Diplomat Home Edit page translations Editing Thang Components Educational Standards Events, subscriptions, shortcuts File system Git Policies Goals HOWTO: Create static teacher page Handle a server error Home Important Artisan Concepts Inspect a view JSON Schema Keyboard Shortcuts Level editor Make yourself admin Mission statement Multiplayer Organize a complicated template Permissions Programming Concepts Project Ideas List Referee Scripting Run dev client on prod db Sample Code Scribe Home Scripts Tab Scripts Settings Tab Show data in a view Simplify Collision Start a New Level Surface System Tasks Tab Technical overview Test client interface Test client Test server endpoint Testing Thang Component System Thang Thangs Tab Third party software and services Tome Translate page strings Treema Versioning Views World i18n Glossary es 419 i18n Glossary nb i18n Glossary ru i18n
2 Add events to a view
Nick Winter edited this page 2015-12-18 15:52:41 -08:00
Table of Contents

Problem

You want your view to do something when the user clicks or otherwise fires a JavaScript/jQuery event.

Solution

Add or extend Backbone.View's events property. Be sure to follow CodeCombat's event naming guidelines.

Example

FooView.coffee

CocoView = require 'views/core/CocoView'
template = require 'templates/foo-view'

module.exports = class FooView extends CocoView
  id: 'foo-view'
  template: template
  events:
    'click #some-btn': 'onClickSomeButton'

  onClickSomeButton: (e) ->
    console.log 'Some button was clicked', e

foo-view.jade

button#some-btn.btn.btn-default Click Me!

Resources

CodeCombat | Home | Blog | Forum | Teachers | Legal | Contribute