Question

我是骨干和backgrid.paginator的初学者。我试图制作一个表并使用backgrid paginator进行分页。它在第一次加载时工作正常，但在过滤后，分页器不起作用。即使它显示了生成的过滤集合所需的页数，但没有切换到其他页面，只显示第一页，单击其他页面编号只显示第一页的内容。代码示例是：

var Organisation = Backbone.Model.extend({});
var OrganisationCollection = Backbone.PageableCollection.extend({
model: Organisation,
state: {pageSize: 20},
mode: "client",
queryParams: {
    currentPage: "current_page",
    pageSize: "page_size"
},
filterBy: function(filterBy,organisationName) {
    var filteredOrg = this.fullCollection.filter(function(model) {
        if(model.get(filterBy).indexOf(organisationName) !== -1) {
            return true;
        }
        return false;
    });
    return new OrganisationCollection(filteredOrg);
}
}

我在该视图中使用bacgrid.paginator为分页创建了一个paginator视图，如下所示：

var PaginationView = Backbone.View.extend({
tagName:"div",
el:"#paginator",
initialize: function(){
    _.bindAll(this,'render','filterRender');
    this.collection.setSorting('name');
    this.collection.on("reset",this.render);
    this.collection.on("filter-by-organisation", this.filterRender);
},

filterRender: function (filterBy,organisationName) {
    var filteredOrg = this.collection.filterBy(filterBy,organisationName);
    var paginator = new Backgrid.Extension.Paginator({
        collection: filteredOrg
    });
    this.$el.html("");
    this.$el.append(paginator.render().el);
    return this;
},
render: function(){
    var paginator = new Backgrid.Extension.Paginator({
        collection: this.collection
    });
    this.$el.html("");
    this.$el.append(paginator.render().$el);
    return this;
}
})

我创建了自己的表

<table class="table table-responsive" >
        <thead>
                <th>Organization</th>
                <th>Type</th>
                <th>Country</th>
                <th>pledge</th>
                <th>commitment</th>
                <th>expenditure</th>
        </thead>
        <tbody id="organization-list">

        </tbody>
 </table>

<div id="paginator"></div>

我的模板是

 <script type="text/template" id="organisation-row-template">
        <td><a href="/frontend/organization/details/<%= id %>"><%= name %></a></td>
        <td><%= type %></td>
        <td><%= country %></td>
        <td><%= transactions.Pledge %></td>
        <td><%= transactions.Commitment %></td>
        <td><%= transactions.Expenditure %></td>

</script>

我在此处排除了用于在表格上呈现集合的其他代码。我认为问题出在Paginator视图中的filterRender函数中。

请给出一些解决方法，这里有什么错误。提前谢谢。

收集过滤器后，backgrid paginator无法正常工作

0 个答案: