ext的Ext.data.JsonStore不自動獲取資料的問題記錄
昨天在一個專案當中發現ext的JsonStore在IE的某些狀況下並不能夠自動從後臺的Action獲取json資料，問題原因到現在也沒有查清楚。在本機的開發環境下對外發布服務一切正常，但是部署到公司的單元測試環境後，還是有些主機通過IE無法訪問（用其他的瀏覽器比如火狐很正常）。
這裡需要記錄的就是問題的部分解決，原來通過本機設定JsonStore的autoLoad為true的時候，對外發佈會一部分主機IE訪問不正常，而改成了手動load資料，那麼通過自己的開發環境對外發布服務一切正常。
typeStore =new Ext.data.JsonStore({
autoLoad:true,
url: root+'/issueType.do?method=getTypeList',
root: 'data',
fields:['typeId','typeName','typeDesc','displayOrder']
});
這是原來設定的一個JsonStore ，設定的屬性autoLoad:true 讓這個頁面被載入的時候，自動地通過url為root+'/issueType.do?method=getTypeList' 來從後臺的Action載入資料，通過解析json資料來繪製前臺。也就是這個設定在一部分IE瀏覽器下不能夠正常實現。
具體解決的方法是不使用自動載入，設定為下面的方法
typeStore =new Ext.data.JsonStore({
autoLoad:false,
url: root+'/issueType.do?method=getTypeList',
root: 'data',
fields:['typeId','typeName','typeDesc','displayOrder']
});
然後手動的拉資料來自於另外地方呼叫typeStore.load();將全部的init函式貼出來
function to_init(){
Ext.QuickTips.init();
typeRecord = Ext.data.Record.create([
{name: "typeId", type: 'string'},
{name: "typeName", type:'string'},
{name: "typeDesc", type:'string'},
{name: "displayOrder", type:'string'}
]);
typeStore =new Ext.data.JsonStore({
autoLoad:false,
url: root+'/issueType.do?method=getTypeList',
root: 'data',
fields:['typeId','typeName','typeDesc','displayOrder']
});
//alert(typeStore.+"-----------");
var colModel = new Ext.grid.ColumnModel([
new Ext.grid.RowNumberer(),
{
header: "問題型別名稱",
dataIndex:'typeName',
width: 300,
sortable: true,
renderer:"htmlEncode",
editor:new Ext.form.TextField({
allowBlank:false
})
}, {
header: "問題型別描述",
dataIndex:'typeDesc',
width: 400,
sortable: true,
renderer:"htmlEncode",
editor:new Ext.form.TextField({
})
}, {
header: "顯示順序",
dataIndex:'displayOrder',
width: 100,
sortable: true,
editor:new Ext.form.NumberField({
allowBlank:false,
allowDecimals:false,
allowNegative:false,
style:'text-align:left;'
})
},
{ header: "刪除",dataIndex:'typeName', width: 80, sortable: false,renderer:showDeleteUrl}
]);
typeGrid = new Ext.grid.EditorGridPanel({
id:'typeGrid',
title:'問題型別管理',
loadMask: {msg:'<bean:message bundle="common" key="js.message.loading"/>'},
trackMouseOver:true,
stripeRows:true,
frame:true,
clicksToEdit: 1,
store: typeStore,
cm:colModel,
iconCls:'icon_grid',
listeners:{//listeners
afteredit:function(e){//if-5
if(e.column==3){//if-4
if(!(e.record.get('displayOrder')!='0'&&e.record.get('displayOrder')=='')){//if-3
for(var i=0;i<typeStore.getCount();i++){//for-1
var rec=typeStore.getAt(i);
if(!(rec.get('displayOrder')!='0'&&rec.get('displayOrder')=='')){//if-2
//if-1
if(e.row!=i&&e.record.get('displayOrder')==rec.get('displayOrder')){
Ext.Msg.alert('<bean:message bundle="common" key="js.message.systemInfo"/>','與第【'+(i+1)+'】行顯示順序重複！');
if(e.column==3 ){
e.record.set('displayOrder','');
}
break;
}//if-1
}//if-2
}//for-1
}//if-3
}//if-4
}//if-5
},
//listeners
tbar:[{
text:'<bean:message bundle="common" key="btn.add"/>',
iconCls:'icon_add',
handler:function(){
var myNewRecord = new typeRecord({
typeId: '',
typeName: '',
typeDesc:'',
displayOrder:''
});
typeStore.add(myNewRecord);
}
}]
});
mainPanel = new Ext.Panel({
layout:'border',
frame:true,
buttons:[
{
text:'<bean:message bundle="common" key="btn.save"/>',
handler:function(){
toSave();
}
},
{
text:'<bean:message bundle="common" key="btn.reset"/>',
handler:function(){
Ext.getCmp('typeGrid').getStore().reload();
}
}
],
buttonAlign:'center',
items:[{
region:'center',
layout:'fit',
autoScroll:true,
items:typeGrid
}]
});
viewport = new Ext.Viewport({
layout:'fit',
id:'viewport',
items:mainPanel
});
typeStore.load();
};