如何处理检查和取消选中extjs中存储的复选框字段

Question

我有一个商店,加载一个显示州名,资本和寒冷天气的网格.

我还有一个复选框,根据"寒冷天气"列的"是"值过滤商店.

当我单击复选框时,网格会过滤并显示"是"的状态,但是当我取消选中该复选框时,它什么都不做.

如何恢复商店以显示以前的商店？下面是我的复选框.请帮忙.

items: [
    {
        xtype: 'checkboxfield',
        boxLabel: 'Show only Cold State',
        scope: this,
        handler: function (field, value) {
            scope: this,
            this.checkValue = field.getValue();
            console.log(this.checkValue);
            if (this.checkValue == true) {
                this.store.filter('Cold', 'Yes');
            }
            else if (this.checkValue == false) {
            }
        },

更新的代码 - 当我这样做时,我收到此错误

TypeError:tempstore1未定义

items: [
    {
        xtype: 'checkboxfield',
        boxLabel: 'Show only Cold State',
        scope: this,
        handler: function (field, value) {
            scope: this,
            this.checkValue = field.getValue();
            console.log(this.checkValue);
            if (this.checkValue == true) {
                var tempstore1 = Ext.StoreMgr.lookup('store');
                tempstore1.filters.add('CheckBoxFilter', new Ext.util.Filter({
                    property: 'Cold',
                    value: 'Yes',
                    root: 'myTable'
                }));
                console.log('here');
                tempstore1.load();
            }
            else if (this.checkValue == false) {
                this.store.filters.removeAtKey('CheckBoxFilter');
            }
        },

第二次更新 - 现在我收到此错误

TypeError:a.getRoot.call(a,d)未定义

代替

var tempstore1 = Ext.StoreMgr.lookup('store');

我在用

var tempstore1 = Ext.getCmp('GridArea1').store;

GridArea1 是我的gridpanel的id.

第三次更新 - 现在我收到此错误

var tempstore1 = Ext.getCmp('GridArea1').getStore();

来自chrome调试器的错误..."true"和"here"是我的console.log,所以是"h"部分......这就是tempstore1而不是我的数据..

true
h {hasListeners:e,scope:h,loading:false,events:Object,eventsSuspended:false ...}
here uncaught
TypeError:无法读取未定义的属性'cold'

Answer 1

你需要使用 clearFilter()

xtype: 'checkboxfield',
boxLabel: 'Show only Cold State',
scope: this,
handler: function (field, value) {
    scope: this,
    this.checkValue = field.getValue();
    console.log(this.checkValue);
    if (this.checkValue == true) {
        this.store.filter('Cold', 'Yes');
    }
    else if (this.checkValue == false) {
        this.store.clearFilter();
    }

可以删除特定的过滤器(clearFilter()将它们全部删除).而不是使用该store.filter('property_to_filter','value')方法,使用:

store.filters.add('Coldfilter', new Ext.util.Filter({
    property: 'Cold',
    value: 'Yes',
    root: 'data'
});
store.load();

要删除过滤器,请使用:

store.filters.removeAtKey('Coldfilter');

文档中没有任何内容root: 'data'可以添加到过滤器中,现在它可以正常工作:http://jsfiddle.net/vrVRP/2/