Question

我正在尝试向Backgrid.Grid添加一个选择框，以便触发一个将状态：{pageSize}重置为用户选择的值的函数。但我无法弄清楚将事件绑定到网格的方式或位置。

我的理解是元素需要成为视图的一部分（我认为是Backgrid.Grid），所以我将选择框添加到网格的页脚并给它一个id并尝试添加一个事件参数和匹配函数，但它什么也没做。

所以，在我的页脚中我有

select id="changePageSize"

并在网格中

events: {
    'change #changePageSize' : 'changePageSize'
},
changePageSize: function(){ console.log('hooray!');}

我认为我的方法在这一点上是完全错误的，但找不到任何指导我走正确路径的方法。

Answer 1

我最终做的是将事件监听器和函数添加到backgrid-paginator扩展。

将选择框添加到_.template（'...

_.template('...<div class="page-size"><select name="pageSize" class="pageSize"><option...');

根据事件我添加了：

'change select.pageSize' : 'changePageSize'

然后创建了函数：

changePageSize: function(e){
    e.preventDefault();
    this.collection.state.pageSize = Math.floor(e.currentTarget.value);
    this.collection.reset();
},

使此功能及其显示可选，并允许开发人员分配数组以生成自定义选项值是有意义的。当我有时间。

Answer 2

关于Duffy Dolan的回答：在你的例子中，一切都很棒，除非你在第三页上说，并选择只在一个页面上显示所有结果，否则会出错。

你只需要添加： this.collection.getPage（1）; //它将始终选择第一页

在Backgrid中，如何使用选择输入更改pageSize？

2 个答案: