ExtJs Grid 远程排序和远程过滤

Question

我在 ExtJs 4.2 中有一个网格。我需要应用远程排序、远程过滤和分页。所以我的商店看起来像这样：

    storeId: 'mainStore',

    pageSize: 10,
    autoLoad: {
        start: 0,
        limit: 10
    },
    autoSync: true,

    remoteSort: 'true', //For Remote Sorting

    sorters: [{
        property: 'COM_KOP_Vertriebsprojektnummer'
        direction: 'ASC'
    }],

    remoteFilter: true, //For Remote Filtering 

    proxy: {
        type: 'rest',
        filterParam: 'filter',
        url: PfalzkomApp.Utilities.urlGetData(),
        headers: {
            'Content-Type': "application/xml"
        },
        reader: {
            type: 'xml',
            record: 'record',
            rootProperty: 'xmlData'
        }

   }

我不想设置 buffered = true 会提前加载我的页面的情况，我有 1000 页，我不想这样做。

远程过滤、分页、排序工作正常但是当我尝试过滤一些东西时，一个单独的排序请求正在进行以及。我怎样才能阻止它？

当我尝试过滤某些东西时有两个请求：

http://127.0.0.1/projektierungen/?_dc=1437058620730&page=1&start=0&limit=10&sort=[{"property":"COM_KOP_Vertriebsprojektnummer","direction":"DESC"}]

http://127.0.0.1/projektierungen/?_dc=1437058620734&page=1&start=0&limit=10&sort=[{"property":"COM_KOP_Vertriebsprojektnummer","direction":"DESC"}]&filter=[{"property":"COM_KOP_Vertriebsprojektnummer","value":"2882"}]

如何停止第一个请求？

我过滤列的代码是这样的：

{
                text: 'Vertriebsprojektnr',
                dataIndex: 'COM_KOP_Vertriebsprojektnummer',
                flex: 1,            
                items    : {
                    xtype:'textfield',
                    flex : 1,
                    margin: 2,
                    enableKeyEvents: true,
                    listeners: {
                        keyup: function() {
                            var store = Ext.getStore('mainStore');
                            store.clearFilter();
                            if (this.value) {
                                //debugger;
                                //debugger;
                                store.filter({
                                    property     : 'COM_KOP_Vertriebsprojektnummer',
                                    value         : this.value,
                                    anyMatch      : true,
                                    caseSensitive : false
                                });

                            }

                        },
                        buffer: 1000,

                    }
                }
            }

由于这个自动生成的请求，我的视图无法正常工作。由于过滤后的结果被这个排序请求所取代。请帮忙。

Answer 1

额外的请求不是因为排序而是因为调用 store.clearFilter()。尝试调用抑制事件的 store.clearFilter(true) 可以阻止该额外请求的事件。

Answer 2

为什么当值为空时要清除过滤器？为什么不过滤空值？我几乎遇到了同样的情况，但我认为我的解决方案在不清除任何东西的情况下运行良好。除此之外，我不想知道要过滤哪个商店或硬编码属性名称。这是我的过滤器字段：

Ext.define('Fiddle.form.TextField', {
    extend: 'Ext.form.field.Text',
    alias: 'widget.filterfield',

    emptyText: 'Filter',
    width: '100%',
    cls: 'filter',
    enableKeyEvents: true,
    listeners: {
        keyup: {
            fn: function(field, event, eOpts) {
                this.up('grid').getStore().filter(new Ext.util.Filter({
                    anyMatch: true,
                    disableOnEmpty: true,
                    property: field.up('gridcolumn').dataIndex,
                    value   : field.getValue()
                }));
            },
            buffer: 250
        }
    }
});

这是视图声明：

dataIndex: 'company',
text: 'Company',
flex: 1,
items: [{
    xtype: 'filterfield'
}]

ExtJs Grid 远程排序和远程过滤

ExtJs Grid Remote Sorting and Remote filtering

sorting

filtering

extjs

extjs4.2

sencha-cmd