用KnockoutJS构建的按列排序的分页表

本文关键字:排序 页表 KnockoutJS 构建 | 更新日期: 2023-09-27 18:16:03

我正试图弄清楚如何通过单击列标题来排序表。我试着在我的ViewModel中创建一个方法,它只会按名称排序,但是没有成功。

我尝试了以下操作,但它似乎没有实际做任何事情:

list.sort(function(left, right) { return left.name== right.name? 0 : (left.name< right.name? -1 : 1) })

下面是我当前的代码:

http://jsfiddle.net/TsgyJ/

例如,我想点击"name"标题,让它按升序排序,然后再次点击,让它按降序排序。

用KnockoutJS构建的按列排序的分页表

下面是您的工作示例:http://jsfiddle.net/tkirda/TsgyJ/1/

Html:

  <thead>
    <th data-bind="click: sort.bind($data, 'id') ">ID</th>
    <th data-bind="click: sort.bind($data, 'name') ">Name</th>
    <th data-bind="click: sort.bind($data, 'email') ">Email</th>
    <th data-bind="click: sort.bind($data, 'city') ">City</th>
    <th data-bind="click: sort.bind($data, 'created') ">Created</th>
  </thead>
JavaScript:

self.sort = function (key) {
    sortDir = sortDir * -1;
    self.list.sort(function (a, b) {
        return sortDir * (a[key] == b[key] ? 0 : (a[key] < b[key] ? -1 : 1));
    });
    self.moveToPage(1);
};