Question

背景
我有ExtJS网格和选项，可以在AJAX的帮助下将新的行/数据添加到网格和数据库中

要求
添加新数据时，我有两个组合框A＆amp; B，而B依赖于A，我想在A的值发生变化时过滤B中的值列表，

代码

Ext.define('Model.A', {
    extend: 'Ext.data.Model',
    fields: ['name', 'id', 'number']
});

Ext.define('Model.B', {
    extend: 'Ext.data.Model',
    fields: ['id', 'name', 'code']
});

商店

var store = {
    A: new Ext.data.Store({
        autoDestroy: true,
        model: 'Model.A',
        data: data.A,
        proxy: {
            type: 'memory'
        }
    }),
    B: new Ext.data.Store({
        autoDestroy: true,
        model: 'Model.B',
        data: data.B,
        proxy: {
            type: 'memory'
        }
    }),
};

网格

var grid = Ext.create('Ext.grid.Panel', {
    store: store.data,
    title: "###########",
    renderTo: "grid",
    loadMask: true,
    features: [filters],                
    columns: [{
        // The ComboB
        text: "B",
        dataIndex: "comboB",
        width: 250,
        editor: {
            xtype: "combo",
            store: store.b,

            displayField: "###",
            valueField: "###",
            forceSelection: true,
            typeAhead: false,

            allowBlank: false,
            blankText: "required.",

            displayTpl: Ext.create('Ext.XTemplate', '<tpl for=".">{###} - {###}</tpl>'),

            listConfig: {
                getInnerTpl: function() {
                    return "{###} - {###}";
                }
            }
        },
        renderer: function(value) {
            return data.B.code[value] + " - " + data.B.name[value];
        }
    }
    .
    . // other grid fields
    .
    ,{
        // The ComboA
        text: "A",
        dataIndex: "comboA",
        width: 250,
        editor: {
            xtype: "combo",
            store: store.insurances,

            displayField: "###",
            valueField: "###",
            forceSelection: true,
            typeAhead: false,

            allowBlank: false,
            blankText: "required.",

            displayTpl: Ext.create('Ext.XTemplate', '<tpl for=".">{###} - {###}</tpl>'),

            listConfig: {
                getInnerTpl: function() {
                    return "{###} - {###}";
                }
            },

            listeners: {
                change: function (e) {
                    A_ID = {"id":e.value};
                    grid.receiveAjaxRequest("URL",A_ID);
                }
            }
        },
        renderer: function(value) {
            return data.A.number[value] + " - " + data.A.name[value];
        },
        filter: {
            type: 'list',
            options: data.insurancesFilter,
            phpMode: true
        }
    }],
    tbar: [{
        // iconCls: 'icon-add',
        text: 'Add',
        scope: this,
        handler: function () {
            .
            .
            .
        }
    }],
    plugins: [rowEditing],
    newRecord: false,
    listeners: {
        beforerender: function() {
            document.getElementById("grid").innerHTML = "";
        }
    },

    /*
     *The Ajax Request Where I have successfully 
     *Received the filtered data and now want to 
     *incorporate the data into the comboB
     */

    receiveAjaxRequest: function (url, ajaxData) {

        gridView = grid.getView();

        gridView.setDisabled(true);

        Ext.Ajax.request({
            url: url,
            params: ajaxData,
            success: function(response) {

                gridView.setDisabled(false);

                //console.log(store.vaccines.data);
                responseJSON = Ext.JSON.decode(response.responseText);

                            // This is how I tried to reload the combox box
                data.B = responseJSON;
                store.B.load();

                //store.B.data = response;
                console.log(store.B);

            }
        });
    } //receiveAjaxRequest
});

我已经在receiveAjaxRequest函数中提供了更改comboA的数据，这就是我尝试重新加载combox框的方法

data.B = responseJSON;
store.B.load();

PS：我对ExtJS不是很熟悉，代码是由其他开发人员编写的。我被分配了以上要求阻止

Answer 1

尝试在商店参数中添加autoLoad : true

Answer 2

我像这样设置actionMethods：

actionMethods: {
        create: 'POST',
        read: 'POST',
        update: 'POST',
        destroy: 'POST'
    }

每次我按下它们时都会重新加载我的组合框内容（由servlet的doPost方法调用数据库查询）。

ExtJS - 无法在AJAX调用后重新加载组合

2 个答案: