功能说明:首先是根据一个GridPanel中的一列数据在另一个EditorGridPanel显示对应的这一列的子菜单的显示。
一、首先定义一个ColumnModel:
var clm_CM = new Ext.grid.ColumnModel({
columns:[
{header:'<center>编号</center>',dataIndex:'CODE'},
{header:'<center>公司名称</center>',dataIndex:'NAME'},
{header:'<center>英文名称</center>',dataIndex:'EN'},
{header:'<center>所属国家</center>',dataIndex:'COUNTRY_NAME'},
{header:'<center>code</center>',dataIndex:'COUNTRY_CODE',hidden:true }
]});
二、定义GridPanel,一些事件的逻辑处理也在这里:
var grd_WestGridPanel = new Ext.grid.GridPanel({
title : '公司列表',
cm : clm_CM,
//sm : rsm_Navigate,
width : 600,
loadMask : true,
region : 'west',
store : sto_Store,
enableColumnResize : false,
enableColumnMove : true,
viewConfig : {
forceFit : true
},
listeners:{
'cellclick':function(grid, rowIndex, columnIndex, e){
var rec = grid.getStore().getAt(rowIndex);
txtf_Code.setValue(rec.get('CODE'));
txtf_Name.setValue(rec.get('NAME'));
txtf_En.setValue(rec.get('EN'));
cmb_Country.setRawValue(rec.get('COUNTRY_NAME'));
cmb_Country.setValue(rec.get('COUNTRY_CODE'));
MODIFY_NO = rec.get('MODIFY_NO');
btn_Applicable.enable();
btn_AddLocalContact.enable();
btn_Commit.disable();
sto_AddressGridPanel_Store.load({
params : {
'COUNTRY_CODE' : rec.get('COUNTRY_CODE'),
'CODE' : txtf_Code.getValue(),
'funcId' : params.funcId
}
});
sto_cmb_CityByCountryCode_Store.load({
params : {
'COUNTRY_CODE' : rec.get('COUNTRY_CODE'),
'funcId' : params.funcId
}
});
}
}
});
三、定义上面的store:
var sto_Store =new Gt.common.engine.JsonStore({
url :...,//根据情况自己设置
root : 'navigate',
fields : [
'CODE',
'NAME',
'EN',
'COUNTRY_NAME',
'COUNTRY_CODE',
'MODIFY_NO'
],
autoLoad : false,
autoDestroy : true
});
四、定义另外的一个EditorGridPanel:
var grd_AddressGridPanel = new Ext.grid.EditorGridPanel({
title: '当前联络地址',
cm : clm_AddressCm,
//sm : rsm_AddressSm,
plugins:[chb_delete],
clicksToEdit:1,
tbar: tlb_AddLocalContact,
loadMask : true,
region : 'center',
store : sto_AddressGridPanel_Store,
enableColumnResize : false,
enableColumnMove : true,
viewConfig : {
scrollOffset : 20,
forceFit : true
}
});
五、定义EditorGridPanel的ColumnModel:
var clm_AddressCm = new Ext.grid.ColumnModel([
{header:'<center>'都市名称'</center>',dataIndex:'CITY_CODE',
editor:new Ext.form.ComboBox({
store: sto_cmb_CityByCountryCode_Store,
valueField:'CITY_CODE',
displayField:'CITY_NAME',
mode: 'local',
triggerAction: 'all'
}),
renderer:function(value){
if(value==''){
return Gt.common.util.getMessage('PJ0022.PAG007.LABEL.021');
}
else{
cmb_City.setValue(value);
return cmb_City.getRawValue();
}
}
},
{header:'<center>地址</center>',dataIndex:'ADDRESS',editor:new Ext.form.TextField({allowBalank:false})},
{header:'<center>电话</center>',dataIndex:'TEL_NO',editor:new Ext.form.TextField({allowBalank:false})},
{header:'<center>电话类型</center>',dataIndex:'TEL_NO_TYPE',editor: cmb_Type, renderer: func_type},
chb_delete
]);
六、定义EditorGridPanel中的store:
var sto_AddressGridPanel_Store =new Gt.common.engine.JsonStore({
url : '...',//根据情况自己设置
root : 'LocalContact',
fields : [
'COUNTRY_CODE',
'CODE',
'BRANCH_NO',
'CITY_CODE',
'CITY_NAME',
'ADDRESS',
'TEL_NO',
'TEL_NO_TYPE',
'DELETE_FLG',
'MODIFY_NO'
],
autoLoad : false,
autoDestroy : true
});
七、定义EditorGridPanel中combobox的store(根据国家获取都市):
// 都市名 ComboBoxのStore byCountryCode
var sto_cmb_CityByCountryCode_Store =new Gt.common.engine.JsonStore({
url : ...,//根据情况自己设置
root : 'getCityByCountryCode',
fields : [
'CITY_CODE',
'CITY_NAME'
],
autoLoad : false,
autoDestroy : true
});
八、定义一个隐藏的combobox(显示所有都市名称):
// 都市 ComboBox
var cmb_City = new Ext.form.ComboBox({
hidden : true,
store : sto_cmb_City_Store,
valueField : 'CITY_CODE',
displayField : 'CITY_NAME'
});
九、隐藏combobox的store:
var sto_cmb_City_Store =new Gt.common.engine.JsonStore({
url :...,//根据情况自己设置
root : 'getCity',
fields : [
'CITY_CODE',
'CITY_NAME'
],
autoLoad : true,
autoDestroy : true
});
特别说明:用隐藏的combobox的作用主要是匹配根据国家获取的都市的名称。