第一次发帖，才开始使用 extjs 2.3（在我的工作中）并且遇到了一个奇怪的问题。基本上，我有一个选项让用户在他们选择的位置和许多预定义位置之间获取 SLD（直线距离），因此用户单击 SLD 按钮，将打开一个新窗口，执行以下操作，将预定义位置加载到一个 jsonstore，将此商店链接到新窗口中的网格中，创建商店时，我还向 googles 方向服务发送请求以返回位置之间的行驶距离，在回调时，我将此数据添加到存储中，然后更新网格。
我看到的问题是，第一次单击 SLD 按钮时，网格显示信息，然后 google 回调将额外的数据添加到存储中，我可以看到网格上显示了这个。我在窗口上有一个后退按钮，单击该按钮后，用户将返回菜单窗口，破坏 SLD 窗口并清空存储，因此不再有 SLD 窗口的痕迹。现在，当我再次单击主菜单上的 SLD 按钮时，问题将发生，我可以看到带有数据的网格，但是现在当 google 回调返回并更新商店时，我看到单元格看起来像是已编辑但未保存。
在我的生产机器上，当我使用 Firefox 或 Chrome 时，这个问题不会发生，只发生在 IE 上，但是我写了一个小的 jsFiddle 来重现这个问题，现在当我运行测试时，这个问题在 Chrome 上发生。
我无法理解它第一次如何正常工作，然后第二次出现这个问题，并且基本上它运行的代码与第一次相同！
这就是我的测试的样子，添加了虚拟数据并简化了重现问题的内容
var testData = [
{'name': 'home', 'distance': 16.5, 'driving_distance': 0 },
{'name': 'work', 'distance': 35.2, 'driving_distance': 0 },
{'name': 'gym', 'distance': 12.8, 'driving_distance': 0 },
];
var locations;
// create store and load it with data
function createStore() {
locations = new Ext.data.JsonStore({
data: testData,
sortInfo: {
field: 'distance',
direction: 'ASC'
},
fields: [
{ name: 'name' },
{ name: 'distance', type: 'float' },
{ name: 'driving_distance', type: 'float' }
]
});
var myLocation = new google.maps.LatLng( '55.033778', '-7.125324' );
var anyLocation = new google.maps.LatLng( '54.972441', '-7.345526' );
var directionsService = new google.maps.DirectionsService();
var request = {
origin: new google.maps.LatLng( '55.033778', '-7.125324' ),
destination: anyLocation,
travelMode: google.maps.DirectionsTravelMode.DRIVING
};
// get driving distance from myLocation to anyLocation and update locations store
for ( var x = 0; x < locations.data.length; x++ )
{
// call directions service
directionsService.route(request, function(response, status) {
// do stuff if we get a result
if (status == google.maps.DirectionsStatus.OK) {
// update store items to use same value just for text purposes
var distance = response.routes[0].legs[0].distance.value;
distance = distance / 1000;
// update on return call even though it updating the same thing 3 times
locations.data.items[0].set('driving_distance', distance.toFixed(1));
locations.data.items[1].set('driving_distance', (distance + 10.1).toFixed(1) );
locations.data.items[2].set('driving_distance', (distance + 23.3).toFixed(1) );
locations.commitChanges();
}
});
}
}
new Ext.Window ({
// menu normally consists of a combo box in which a user can select SLD
title: 'Menu - cut down',
id: 'rightClickWindow',
headerPosition: 'left',
scope: this,
buttons: [{
text: 'SLD',
id: 'SLDButton',
handler: function () {
// hide menu window
Ext.getCmp('rightClickWindow').hide();
// create store
createStore();
// create SLD window
new Ext.Window ({
title: 'SLD',
id: 'createSLDWindow',
headerPosition: 'left',
width: 450,
scope: this,
items: [{
xtype: 'grid',
id: 'SLDGrid',
singleSelect: true,
store: locations,
columns: [
{id: 'name', header: 'Location', width: 160, sortable: false, dataIndex: 'name'},
{header: 'SLD', width: 80, align: 'center', sortable: false, renderer: 'distance', dataIndex: 'distance'},
{header: 'Driving Distance', width: 90, align: 'center', sortable: false, renderer: 'driving_distance', dataIndex: 'driving_distance'}],
stripeRows: true,
autoExpandColumn: 'name',
enableHdMenu: false,
height: 250,
header: false
} ],
buttons: [{
text: 'Back',
id: 'SLDBackButton',
handler: function () {
// destroy SLD window
Ext.getCmp('createSLDWindow').destroy();
// show menu window
Ext.getCmp('rightClickWindow').show();
// destroy store
locations.loadData([],false);
}
}],
listeners: {
close: function (form) {
// destory everything
Ext.getCmp('createSLDWindow').destroy();
Ext.getCmp('rightClickWindow').destroy();
// destroy store
locations.loadData([],false);
}
}
}).show();
}
}]
}).show();
jsFiddle http://jsfiddle.net/UDkDY/74/
重现点击 SLD -> 返回 -> SLD