Question

我商店中的数据如下：

responseText:
"insurance" : [{
        "insurance_id" : "1",
        "insurance_companyName" : "Nas Administrative Services",
        "insurance_status" : "1"
    }, {
        "insurance_id" : "2",
        "insurance_companyName" : "Abu Dhabi National Insurance Company",
        "insurance_status" : "0"
    }
]

我正在将这些数据传递到组合框。

              {
                xtype:'combobox',
                name:'network_comapanyId',
                fieldLabel: 'Insurance Company',
                displayField: 'insurance_companyName',
                valueField: 'insurance_id',                                     
                store: insuranceStore,
                allowBlank: false,
                padding: '2 2 2 2',
                width: 300, 
                queryMode : 'local'
            },

它正在显示数据，但是我只想显示带有'insurance_status : 1'.的项目

我在其他页面中使用了相同的商店数据，因此无法更新我的商店。有什么解决方案可以仅显示活动项目？

Answer 1

您可以在商店中添加过滤器，例如Filldle

Ext.create('Ext.form.Panel', {
title: 'FOrm',
width: 400,
height: 200,
renderTo: Ext.getBody(),
items: [{
    xtype: 'combobox',
    reference: 'states',
    publishes: 'value',
    fieldLabel: 'Select State',
    displayField: 'displayField',
    anchor: '-15',
    store: {
        fields: ['valueField', 'displayField', 'fieldStatus'],
        filters: [{
            property: 'fieldStatus',
            value: 1
        }],
        data: [
            ['1', 'MyDisplayValueFor1', 1],
            ['2', 'MyDisplayValueFor2', 0],
            ['3', 'MyDisplayValueFor3', 1]
        ]
    }
}]
});

Answer 2

这是另一种过滤方式：

var myStore = Ext.create('Ext.data.Store', {
     model: 'User',
     storeId:'userStore',
     autoLoad: true,
     load:function(){
        Ext.Ajax.request({
        url: '/rmwb/resources/js/app/infoBar/data/data.json',
        timeout: 60000,
        method: 'GET',
        scope: this,
        success: function(resp) {
            console.log(resp.responseText);
            var store = Ext.data.StoreManager.lookup('userStore');
            var data = Ext.JSON.decode(resp.responseText);
            var filteredData = data.insurance.filter(instance => instance["insurance_status"]==1);
            store.loadData(filteredData), true);
        },
        failure: function(resp, opts) {


        },
        callback: function(options, success, resp) {
        }
        });
     }
 });

Answer 3

添加带有expand事件的侦听器并在其中过滤存储是一个更好的方法。我已通过添加相关代码来更新您的代码。请在下面找到它：

{
    xtype:'combobox',
    name:'network_comapanyId',
    fieldLabel: 'Insurance Company',
    displayField: 'insurance_companyName',
    valueField: 'insurance_id',                                     
    store: insuranceStore,
    allowBlank: false,
    padding: '2 2 2 2',
    width: 300, 
    queryMode : 'local',
    listeners: {
        expand : function(combo, eOpts){
            combo.store.filter('insurance_status',1);
        }
    }
}

仅显示组合框ExtJ中的活动项目

3 个答案: