我仍在尝试在骨干网络应用程序中实现过滤器功能，但仍然出现错误。 看法
define([
'underscore',
'backbone',
'collections/tables/TablesCollection',
'text!templates/tables/tablesTemplate.html',
'lunr',
'backgrid',
'backbone.paginator',
'backgrid-paginator',
'backgrid-filter',
], function(_, Backbone, TablesCollection, tablesTemplate, lunr, backgrid){
var TablesView = Backbone.View.extend({
el: document.getElementById("content"),
render: function() {
var tables = JSON.parse(localStorage.getItem('tables'));
var tablesCollection = new TablesCollection(tables);
this.el.innerHTML = _.template( tablesTemplate,{data : tablesCollection.toJSON()});
var columns = [{
name: "id",
label: "ID",
editable: false,
cell: Backgrid.IntegerCell.extend({
orderSeparator: ''
})
}, {
name: "title",
label: "Name",
cell: "string"
}, {
name: "seats",
label: "Seats",
cell: "string"
}, {
name: "location",
label: "Location",
cell: "string"
}, {
name: "date",
label: "Active",
cell: "activ",
editable: false,
},{
name: "dummy",
label: "Delete",
cell: "dele",
editable: false,
}];
var pageableGrid = new Backgrid.Grid({
columns: columns,
collection: tablesCollection
});
var $example2 = $("#example-2-result");
$example2.append(pageableGrid.render().el)
var paginator = new Backgrid.Extension.Paginator({
collection: tablesCollection
});
$("#example-2-pagi").append(paginator.render().el);
var clientSideFilter = new Backgrid.Extension.ClientSideFilter({
collection: clientTerritories,
placeholder: "Search in the browser",
fields: ['name'],
wait: 150
});
// $("#client-side-filter-example-result").prepend(clientSideFilter.render().el);
},
});
return TablesView;
});
路由器
define([
'underscore',
'backbone',
'models/table/TableModel',
'collections/tables/TablesCollection',
'views/tables/TablesView',
'lunr',
'backgrid',
'backbone.paginator',
'backgrid-paginator',
'backgrid-filter',
], function(_, Backbone, TableModel, TablesCollection, TablesView) {
if(localStorage.getItem('tables') == null){
var tables = [
{title: "Table 1", seats: "3", location: "venku", active:true, cls: "1cls"},
{title: "Table 2", seats: "3", location: "venku", active:true, cls: "2cls"},
{title: "Table 3", seats: "3", location: "venku", active:true, cls: "3cls"},
{title: "Table 4", seats: "3", location: "venku", active:true, cls: "4cls"},
{title: "Table 5", seats: "3", location: "venku", active:true, cls: "1cls"},
{title: "Table 6", seats: "3", location: "venku", active:true, cls: "2cls"},
{title: "Table 7", seats: "3", location: "venku", active:true, cls: "3cls"},
{title: "Table 8", seats: "3", location: "venku", active:true, cls: "4cls"},
{title: "Table 9", seats: "3", location: "venku", active:true, cls: "1cls"},
{title: "Table 10", seats: "3", location: "venku", active:false, cls: "2cls"},
{title: "Table 11", seats: "3", location: "venku", active:false, cls: "3cls"},
{title: "Table 12", seats: "3", location: "venku", active:false, cls: "4cls"},
];
localStorage.setItem('tables',JSON.stringify(tables));
}
var AppRouter = Backbone.Router.extend({
routes: {
'':'tables',
'tables':'tables',
}
});
var initialize = function(){
window.app_router = new AppRouter;
app_router.on('route:tables', function(table) {
var tablesView = new TablesView({model:{table:table}});
tablesView.render();
});
Backbone.history.start();
};
return {
initialize: initialize
};
});
收藏
define([
'underscore',
'backbone',
'models/table/TableModel',
'lunr',
'backgrid',
'backbone.paginator',
'backgrid-paginator',
'backgrid-filter',
], function(_, Backbone, TableModel){
var TablesCollection = Backbone.PageableCollection.extend({
model: TableModel,
//url: "",
state: {
pageSize: 5
},
mode: "client", // page entirely on the client side
});
return TablesCollection;
});
没有过滤器的表工作正常，但现在我有错误：Uncaught TypeError: Cannot read property 'Extension' of undefined我不知道我做错了什么。谢谢你的帮助。