Extjs 在我的应用程序中，它显示带有一些数据的网格，其中一个字段是可编辑的。如果对第一个网格进行编辑，我想更新第二个网格数据

我已经创建了一个应用程序，其中显示了一个网格和一些数据，其中一个字段是可编辑的。如果对第一个网格字段进行编辑，我想更新第二个网格数据 例如 网格中有“开发人员数量”、“成本”、“每点成本”等字段，其中“成本”是可编辑的，如果我编辑“成本”，它将更新“每点成本”

但我也在为每个团队创建更多基于此的网格。 所以现在当“成本”被编辑时，我想在另一个网格中更新“成本”。 我应该如何做到这一点，有什么想法吗。提前谢谢

下面是我的代码

_draw_grid: function(newHash, committedData) {
    var chart = Ext.getCmp('mychart');
    if (chart) {
        chart.destroy();
    };              
    acceptedPoints = {};
    Ext.Array.each(committedData, function(cData){
        if ( ! acceptedPoints[cData.ProjectName] ) { acceptedPoints[cData.ProjectName] = 0; }
        acceptedPoints[cData.ProjectName] = cData.Accept;
    });
    summaryHash = {};
    _.each(this.projects, function(team) {
        if (!summaryHash[team] && newHash[team]) {
            summaryHash[team] = {
                Name: team,
                Count: newHash[team].length,
                Days: 10,
                Points: acceptedPoints[team],
                Salary: "200000",
                Cost: 0, 
                ManDays: 0
            };
            if (acceptedPoints[team] > 0) {
                summaryHash[team].ManDays = (10/acceptedPoints[team]) * newHash[team].length;
            }
        };
    });
    records = [];
    Ext.Object.each(summaryHash, function(key, value) {     
        if (newHash[key]) {
            records.push(value);
        }   
    });
    this.records = records;
    var cfgsValues = [];
    costs = {};
    var self = this;
    cfgsValues.push({text: 'Teams', style:"background-color: #D2EBC8", dataIndex: 'Name', width: 170, renderer: function(value, meta_data, record, row, col) {
        return value;
    }});                    
    cfgsValues.push({text: '# Developers', style:"background-color: #D2EBC8", dataIndex: 'Count', width: 70, renderer: function(value, meta_data, record, row, col) {
        return value;
    }});
    cfgsValues.push({text: '# Points', style:"background-color: #D2EBC8", dataIndex: 'Points', width: 60, renderer: function(value, meta_data, record, row, col) {
        return value;
    }});
    cfgsValues.push({text: '# Days in Sprint', style:"background-color: #D2EBC8", dataIndex: 'Days', width: 60, renderer: function(value, meta_data, record, row, col) {
        return value;
    }});
    cfgsValues.push(
        {text: '# Average Salary Cost per Sprint', style:"background-color: #D2EBC8", dataIndex: 'Salary', width: 70, renderer: function(value, meta_data, record, row, col) {
            return "$" +value;
        }, 
        editor: {
            xtype: 'textfield', // this assumes that salary is a number; if not, set to 'textfield'
        }
    });     
    cfgsValues.push({text: '# Cost of 1 Story Point', style:"background-color: #D2EBC8", dataIndex: 'Cost', width: 70, renderer: function(value, meta_data, record, row, col) {
        var c = Ext.Number.toFixed(record.get('Salary')/record.get('Count'), 2);
        costs[record.get('Name')] = c;
        return c;
    }});
    cfgsValues.push({text: '# man-days need per 1 Story Point', style:"background-color: #D2EBC8", dataIndex: 'ManDays', width: 70, renderer: function(value, meta_data, record, row, col) {
        return Ext.Number.toFixed(value, 2);
    }});                    
    this.setLoading(false);
    CalcHash = {};
    Ext.Array.each(this.records, function(rec){
        if ( ! CalcHash[rec.Name] ) { CalcHash[rec.Name] = []; }
        CalcHash[rec.Name] = rec.ManDays;
    });                 
    var grid = Ext.create('Ext.Container', {
        items: [{
            xtype: 'rallygrid',
            bodyBorder: 1,
            id: 'mychart',
            showPagingToolbar: false,
            showRowActionsColumn: false,
            enableEditing:true,
            editable: true,
            height: 250,
            width: 570,
            selType: 'cellmodel',
            plugins: [
                Ext.create('Ext.grid.plugin.CellEditing', {
                    clicksToEdit: 2,
                    pluginId: 'cellplugin',
                })
            ],                  
            store: Ext.create('Rally.data.custom.Store', {
                data: records
            }),
            columnCfgs: cfgsValues
        }]  
    }); 
    this.down('#display_box').add(grid);        
    Ext.create('Rally.data.wsapi.Store', {
        model: 'portfolioitem/feature',
        autoLoad: true,
        limit: Infinity,
        fetch: ['Name', 'Project', 'AcceptedLeafStoryPlanEstimateTotal'],
        context: {
            project: this.getContext().getProject()._ref,
            projectScopeDown: true,
            projectScopeUp: false
        },
        listeners: {
            load: this._categorizeFeatures,
            scope: this
        }
    });                     
},
_categorizeFeatures: function(store, data) {
    HashedFeatures = {};
    Ext.Array.each(data, function(feature){
        if ( ! HashedFeatures[feature.get('Project').Name] ) { HashedFeatures[feature.get('Project').Name] = []; }                  
        HashedFeatures[feature.get('Project').Name].push([feature.get('Name'), feature.get('AcceptedLeafStoryPlanEstimateTotal')])
    });
    //console.log("data values", HashedFeatures);
    Ext.Object.each(HashedFeatures, function(k, v){
        this._createFeatureGrid(k,v);
    }, this);
},
_createFeatureGrid: function(team, values) {
    Ext.Array.each(this.projects, function(team){
        var team = Ext.getCmp(team);
        var teamlabel = Ext.getCmp('label'+team);
        if(team && teamlabel) {
            team.destroy();
            teamlabel.destroy();
        }
    });                 
    summaryHash = {};
    _.each(values, function(val) {
        if (!summaryHash[val[0]]) {
            summaryHash[val[0]] = {
                Name: val[0],
                Points: val[1],
                FManDays: 0,
                FCost: 0,
                Team: team
            };
        };
    }); 
    records = [];
    Ext.Object.each(summaryHash, function(key, value) {     
        if (summaryHash[key]) {
            records.push(value);
        }   
    });                 
    var cfgsValues = [];
    var self = this;
    cfgsValues.push({text: 'Feature', style:"background-color: #D2EBC8", dataIndex: 'Name', width: 170, renderer: function(value, meta_data, record, row, col) {
        return value;
    }});                    
    cfgsValues.push({text: 'Points', style:"background-color: #D2EBC8", dataIndex: 'Points', width: 70, renderer: function(value, meta_data, record, row, col) {
        return value;
    }});
    cfgsValues.push({text: 'man-days needed', style:"background-color: #D2EBC8", dataIndex: 'FManDays', width: 70, renderer: function(value, meta_data, record, row, col) {
        return record.get('Points')*record.get('Points');
    }});
    cfgsValues.push({text: 'Cost in $', style:"background-color: #D2EBC8", dataIndex: 'FCost', width: 70, renderer: function(value, meta_data, record, row, col) {
        return "$" + Ext.Number.toFixed(costs[team]*record.get('Points'));
    }});                    
    var grid = Ext.create('Ext.Container', {
        layout: {
            type: 'vbox'
        },
        width: 450,
        renderTo: Ext.getBody(),        
        items: [
        {
            xtype: 'label',
            forId: team,
            id: 'label'+team,
            text: team,
            margin: '0 0 0 0',
            style: {
                width: '250px',
                height: '50px',
                fontWeight: 'bold',
                borderColor: 'red',
                borderStyle: 'solid'
            },  
            border: 1           
        },                          
        {
            xtype: 'rallygrid',
            bodyBorder: 1,
            id: team,
            showPagingToolbar: false,
            showRowActionsColumn: false,
            enableEditing:true,
            editable: true,
            //height: 100,
            width: 400,
            border: true,
            selType: 'cellmodel',
            plugins: [
                Ext.create('Ext.grid.plugin.CellEditing', {
                    clicksToEdit: 2,
                    pluginId: 'cellplugin',
                })
            ],                  
            store: Ext.create('Rally.data.custom.Store', {
                data: records
            }),
            columnCfgs: cfgsValues
        }                   
        ]   
    });  

我会在你的手机编辑插件中添加一个

你的rallygrid看起来像：

{
        xtype: 'rallygrid',
        bodyBorder: 1,
        id: team,
        showPagingToolbar: false,
        showRowActionsColumn: false,
        enableEditing:true,
        editable: true,
        //height: 100,
        width: 400,
        border: true,
        selType: 'cellmodel',
        plugins: [
            Ext.create('Ext.grid.plugin.CellEditing', {
                clicksToEdit: 2,
                pluginId: 'cellplugin',

                /*** NEW CODE ***/
                listeners: {
                    'edit': function(editingPlugin, e, eOpts) {
                        var field = e.field;
                        if (field === 'Cost') {
                            console.log('update other stores');
                        }
                    }
                }
                /*** END NEW CODE ***/

            })
        ],                  
        store: Ext.create('Rally.data.custom.Store', {
            data: records
        }),
        columnCfgs: cfgsValues
}