javascript - Is Backbone's view 'events' property only for DOM events? -

i've got piece code in view:

//dom events -----  ,events:{     'click #language-switcher input[type="radio"]': function(e){         this.current_language = $(e.target).val();     }     ,'click .create-gcontainer-button': function(){         this.collection.add(new group());     } }  ,set_events:function(){      //model events -----      this.listento(this.collection,'add',function(group){         var group = new groupview({ model: group });         this.group_views[group.cid] = group;         this.groups_container.append(group.el);         eventtools.trigger("group_view:create",{ lang:this.current_language });     });      this.listento(this.collection,'destroy',function(model){         console.log('removing model:', model);     });      //emitter events ---      eventtools.on('group_view:clear',this.refresh_groups, this);  }//set_events 

note: set_events gets called on initialization. well, don't defining events in 2 different places, since docs events defined 'events' prop bound element (or children of if selector passed), guess cannot use other types of events. correct?

i tried define 'events' inside set_events function, reason leads memory leak or similar (browser gets stuck).

so more general question be: on backbone view, there way define events in 1 single place?

within view, there 2 types of events can listen for: dom events , events triggered using event api. important understand differences in how views bind these events , context in callbacks invoked. om events can bound using view’s events property or using jquery.on(). within callbacks bound using events property, refers view object; whereas callbacks bound directly using jquery have set handling dom element jquery. dom event callbacks passed event object jquery. see delegateevents() in backbone documentation additional details.

event api events bound described in section. if event bound using on() on observed object, context parameter can passed third argument. if event bound using listento() within callback refers listener. arguments passed event api callbacks depends on type of event. see catalog of events in backbone documentation details.

yes can define events in view initialize method, see below example

// add javascript here var view = backbone.view.extend({    el: '#todo',   // bind dom event using events property   initialize: function() {     // bind dom event using jquery     this.events = {       'click [type="checkbox"]': 'clicked'     };     this.$el.click(this.jqueryclicked);     // bind api event     this.on('apievent', this.callback);   },    // 'this' view   clicked: function(event) {     console.log("events handler " + this.el.outerhtml);     this.trigger('apievent', event.type);   },    // 'this' handling dom element   jqueryclicked: function(event) {     console.log("jquery handler " + this.outerhtml);   },    callback: function(eventtype) {     console.log("event type " + eventtype);   }  }); 

you can see demo here

for code

set_events:function(){      //dom events -----     this.events={         'click #language-switcher input[type="radio"]': function(e){             this.current_language = $(e.target).val();         }         ,'click .create-gcontainer-button': function(){             this.collection.add(new group());         }     };      //model events -----      this.listento(this.collection,'add',function(group){         var group = new groupview({ model: group });         this.group_views[group.cid] = group;         this.groups_container.append(group.el);         eventtools.trigger("group_view:create",{ lang:this.current_language });     });      this.listento(this.collection,'destroy',function(model){         console.log('removing model:', model);     });      //emitter events ---      eventtools.on('group_view:clear',this.refresh_groups, this);  }//set_events