Skip to content

Instantly share code, notes, and snippets.

@mxriverlynn
Created July 19, 2011 13:57
Show Gist options
  • Save mxriverlynn/1092444 to your computer and use it in GitHub Desktop.
Save mxriverlynn/1092444 to your computer and use it in GitHub Desktop.
using an event aggregator with backbone
MedicationView = Backbone.View.extend({
events: {
"click #edit": "editMedication"
},
editMedication: function(){
var editView = new AddEditView({model: this.model});
editView.render();
}
});
MedicationView = Backbone.View.extend({
events: {
"click #edit": "editMedication"
},
initialize: function(options){
this.addEditView = options.addEditView;
}
editMedication: function(){
this.addEditView.render();
}
});
// initialize everything here...
// 'medicationList' is a collection of medications
var addEditView = new AddEditView(...);
medicationlist.each(function(med){
new MedicationView({model: med, addEditView: addEditView});
}
MedicationRouter = Backbone.Router.extend({
routes: {
"edit/:id": "editMedication"
},
editMedication: function(id){
var med = medicationList.get(id);
this.addEditView.editMedication(med);
}
});
AddEditView = Backbone.View.extend({
editMedication: function(medication){
this.model = medication;
this.render();
}
});
var vent = _.extend({}, Backbone.Events);
AddEditView = Backbone.View.extend({
initialize: function(options){
_.bindAll(this, "editMedication");
options.vent.bind("editMedication", this.editMedication);
},
editMedication: function(medication){
this.model = medication;
this.render();
}
});
MedicationView = Backbone.View.extend({
events: {
"click #edit": "editMedication"
},
initialize: function(options){
this.vent = options.vent;
},
editMedication: function(){
this.vent.trigger("editMedication", this.model);
}
});
// initialize everything, and tie it all together
// with the event aggregator object: vent
var vent = _.extend({}, Backbone.Events);
var addEditView = new AddEditView({vent: vent});
medicationList.each(function(med){
new MedicationView({model: med, vent: vent});
});
@justinshea
Copy link

Hi Derick,

In example 3, the router object references the add/edit view with "this".( I think I have also seen other examples in my readings where routers seem to have built in references to collections and views) How can it do that? Does the router have to be instantiated with a reference to the view or collection in options?
Thanks,
Justin

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment