ExtJS的grid排序

grid的排序分为2种:

1.内存排序,根据当前已有的数据进行排序,不予后台交互

2.后台排序,将排序的字段和排序方式,以字符串的形式传递到后台,后台接受到之后对数据进行一个排序返回。

注意:这2个排序都是基于store的。什么叫基于store呢,就是表格本来没有数据,是通过store来发送请求得到数据的。数据在store中,所以可以内存排序。那么后台排序,在点击排序后是让store发送请求,然后再次获取排好序的数据,在grid中展示。


内存排序,默认就是进项内存排序,不需要设置什么。

   但是如果你想按照自己的规则,来进行一个内存排序,那么就需要你重写Ext.grid.column.Column。主要重写getSortParam方法。这个方法返回,你排序的列参数,升序降序信息。默认是dateIndex。 以及sort方法。就是在排序的时候调用sort方法。

 sort: function (direction) {
        var me = this;
        if (me.ownerCt.grid.ownerGrid.enableLocalSort) {
            me.localSort(direction);
        } else {
            me.callParent(arguments);
        }
    }
这样就可以根据自己的判断,去是否使用自己的排序。callParent就是调自己的默认排序。


后台排序,如果是普通的store,那么你需要设置remoteSort: true ,这个就是上面sort的参数,direction。如果你使用的是bufferStore那么就不需要设置这个参数了。

后台排序,设置之后,同上面一样重写column 。这里就直接调用sort,获取grid,以及grid的store。

store.sort(me.getSortParam(), 'DESC', grid.multiColumnSort ? 'multi' : 'replace');
通过这个,排序就会向后台发送请求。然后store重新获取返回的数据。

sort: function (direction) {
        var me = this,
            grid = me.up('tablepanel'),
            store = grid.store,
            ascCls = me.ascSortCls,
            descCls = me.descSortCls,
            changed;
        Ext.suspendLayouts();
        me.sorting = true;
        store.sortProperty = me.stateId;

        if (!Ext.isEmpty(direction)) {
            store.sort(me.getSortParam(), direction, grid.multiColumnSort ? 'multi' : 'replace');
            switch (direction) {
                case 'DESC':
                    if (!me.hasCls(descCls)) {
                        me.addCls(descCls);
                        changed = true;
                    }
                    ;
                    me.removeCls(ascCls);
                    break;
                case 'ASC':
                    if (!me.hasCls(ascCls)) {
                        me.addCls(ascCls);
                        changed = true;
                    }
                    ;
                    me.removeCls(descCls);
                    break;
                default:
                    me.removeCls([
                        ascCls,
                        descCls
                    ]);
                    break;
            }
        } else {
            if (me.hasCls(ascCls)) {
                store.sort(me.getSortParam(), 'DESC', grid.multiColumnSort ? 'multi' : 'replace');
                me.addCls(descCls);
                me.removeCls(ascCls);
            } else if (me.hasCls(descCls)) {
                store.sort(me.getSortParam(), 'ASC', grid.multiColumnSort ? 'multi' : 'replace');
                me.addCls(ascCls);
                me.removeCls(descCls);
            } else {
                store.sort(me.getSortParam(), 'ASC', grid.multiColumnSort ? 'multi' : 'replace');
                me.addCls(ascCls);
            }

        }

        delete me.sorting;
        Ext.resumeLayouts(true);
    }



你可能感兴趣的:(工作中前台遇到的问题)