(Let me preface with I am new to Backbone and Backgrid.) I am using Backgrid and select-all extension and I was having issues "catching" the event that the select all fires in my containing/parent view. I want to show a details view when a row is selected in the master grid. So, I need the select event in the grid to bubble up to the parent view so it can show the details in another view.
var view = Backbone.View.extend({
el: '.grid',
initialize: function () {
var columns = [{
name: "id",
label: "ID",
editable: false,
cell: "string"
}, {
name: "",
label: "Action",
cell: "select-row"
}];
var grid = new Backgrid.Grid({
columns: columns,
collection: this.collection
});
$("#backgrid").append(grid.render().$el);
});
});
Now I am thinking I want to add something like this to the view
events: {
"backgrid:select": "<name of the function i want to call>"
}
But that doesn't seem to work. Any help would be appreciated.
I was able to answer my own question...in the view add....
this.collection.on('backgrid:selected', function(model, selected) {
//do what i need here
});
backgrid is already triggering the event backgrid:select (which is handled via the model) but it also triggers the event backgrid:selected which bubbles up in the collection...which in turn is accessible via the parent view.
A reference to the official API documentation pointing this out can be found here