我创建了一个应用程序，它显示一个包含一些数据的网格，其中一个字段是可编辑的。如果对第一个网格字段进行编辑，我想更新第二个网格数据 例如 网格包含“no.of dev”“Cost”“每点费用”等字段，“费用”可编辑，如果我编辑“费用”则更新“每点费用”
但我也在为每个团队创建更多基于此的网格。 所以现在当编辑“成本”时，我想更新另一个网格中的“成本”。 我应该如何实现这一点，任何想法。提前谢谢。
以下是我的代码
_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
}
]
});
答案 0 :(得分：1)
我会在你的CellEditing插件中添加"edit" listener。
你的拉力赛网格看起来像：
{
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
}