由于地址数据过多无法发贴,变量data中的数组数据已给我删略
/*
{ xtype: 'exaddress', name: 'F_Work_Palce', fieldLabel: '工作地', allowBlank: true, width: '75%', layout: 'checkboxgroup', },
*/
//地区联动地址组件
Ext.define('ExAddress', {
extend: 'Ext.form.FieldContainer',
alias: ['widget.exaddress'],
mixins: {
field: 'Ext.form.field.Field'
},
requires: [
'Ext.form.field.ComboBox',
],
items: [
],
allowBlank: true,
width:'100%',
//layout: 'checkboxgroup',
initComponent: function () {
var me = this;
//地区数据
var data = [
['1', '中国', '中国', '0', '0', '0', 'Zhong Guo', '2'],
['2', '110000', '北京市', '1', '0', '0', 'Beijing Shi', 'BJ'],
['3', '120000', '天津市', '1', '0', '0', 'Tianjin Shi', 'TJ'],
['4', '130000', '河北省', '1', '0', '0', 'Hebei Sheng', 'HE'],
['5', '140000', '山西省', '1', '0', '0', 'Shanxi Sheng ', 'SX']
];
//国store
var storeCountry = new Ext.data.ArrayStore({
fields: ['REGION_ID', 'REGION_CODE', 'REGION_NAME', 'PARENT_ID','REGION_LEVEL', 'REGION_ORDER', 'REGION_NAME_EN', 'REGION_SHORTNAME_EN'],
data: data
});
//省store
var storeProvince = new Ext.data.ArrayStore({
fields: ['REGION_ID', 'REGION_CODE', 'REGION_NAME', 'PARENT_ID', 'REGION_LEVEL', 'REGION_ORDER', 'REGION_NAME_EN', 'REGION_SHORTNAME_EN'],
data: data
});
//市store
var storeCity = new Ext.data.ArrayStore({
fields: ['REGION_ID', 'REGION_CODE', 'REGION_NAME', 'PARENT_ID', 'REGION_LEVEL', 'REGION_ORDER', 'REGION_NAME_EN', 'REGION_SHORTNAME_EN'],
data: data
});
//区store
var storeArea = new Ext.data.ArrayStore({
fields: ['REGION_ID', 'REGION_CODE', 'REGION_NAME', 'PARENT_ID', 'REGION_LEVEL', 'REGION_ORDER', 'REGION_NAME_EN', 'REGION_SHORTNAME_EN'],
data: data
});
storeCountry.clearFilter(true);
storeCountry.filterBy(function (record) {
return record.get('PARENT_ID') == "0";
});
storeProvince.clearFilter(true);
storeProvince.filterBy(function (record) {
return false;
});
storeCity.clearFilter(true);
storeCity.filterBy(function (record) {
return false;
});
storeArea.clearFilter(true);
storeArea.filterBy(function (record) {
return false;
});
//国
var comboCountry = {
xtype: 'combobox',
editable: true,
allowBlank: me.allowBlank,
forceSelection: true,
name: 'province',
width: me.width,
labelWidth: 15,
fieldLabel: '国',
//emptyText: '请选择国家',
labelAlign: 'right',
store: storeCountry,
displayField: 'REGION_NAME',
valueField: 'REGION_NAME',
triggerAction: 'all',
queryMode: 'local',
autoSelect: true,
listeners: {
select: function (combo, recordp, index) {
storeProvince.clearFilter(true);
storeProvince.filterBy(function (record) {
return record.get('PARENT_ID') == recordp[0].get("REGION_ID");
});
storeCity.clearFilter(true);
storeCity.filterBy(function (record) {
return false;
});
storeArea.clearFilter(true);
storeArea.filterBy(function (record) {
return false;
});
if (storeProvince.count() > 0) {
me.getBoxes()[1].show();
}
else
{
me.getBoxes()[1].hide();
}
if (storeCity.count() > 0) {
me.getBoxes()[2].show();
}
else {
me.getBoxes()[2].hide();
}
if (storeArea.count() > 0) {
me.getBoxes()[3].show();
}
else {
me.getBoxes()[3].hide();
}
me.getBoxes()[1].setValue('');
me.getBoxes()[2].setValue('');
me.getBoxes()[3].setValue('');
},
afterRender: function (combo) {
var store = combo.getStore();
if (store.getCount() > 0) {
var firstValue = store.getAt(0).data.REGION_NAME;
combo.setValue(firstValue);//同时下拉框会将与name为firstValue值对应的 text显示
combo.setValue(firstValue).fireEvent('select', combo, [combo.findRecord("REGION_NAME", firstValue)]);
}
}
},
};
//省
var comboProvince = {
xtype: 'combobox',
editable: true,
allowBlank: true,
forceSelection: true,
name: 'province',
width: me.width,
labelWidth: 15,
fieldLabel: '省',
//emptyText: '请选择省份',
labelAlign: 'right',
store: storeProvince,
displayField: 'REGION_NAME',
valueField: 'REGION_NAME',
triggerAction: 'all',
queryMode: 'local',
hidden:true,
listeners: {
select: function (combo, recordp, index) {
storeCity.clearFilter(true);
storeCity.filterBy(function (record) {
return record.get('PARENT_ID') == recordp[0].get("REGION_ID");
});
storeArea.clearFilter(true);
storeArea.filterBy(function (record) {
return false;
});
if (storeCity.count() > 0) {
me.getBoxes()[2].show();
}
else {
me.getBoxes()[2].hide();
}
if (storeArea.count() > 0) {
me.getBoxes()[3].show();
}
else {
me.getBoxes()[3].hide();
}
me.getBoxes()[2].setValue('');
me.getBoxes()[3].setValue('');
}
},
};
//市
var comboCity = {
xtype: 'combobox',
editable: true,
allowBlank: true,
forceSelection: true,
name: 'city',
width: me.width,
labelWidth: 15,
fieldLabel: '市',
//emptyText: '请选择市',
labelAlign: 'right',
store: storeCity,
displayField: 'REGION_NAME',
valueField: 'REGION_NAME',
triggerAction: 'all',
queryMode: 'local',
hidden: true,
listeners: {
select: function (combo, recordp, index) {
storeArea.clearFilter(true);
storeArea.filterBy(function (record) {
return record.get('PARENT_ID') == recordp[0].get("REGION_ID");
});
if (storeArea.count() > 0) {
me.getBoxes()[3].show();
}
else {
me.getBoxes()[3].hide();
}
me.getBoxes()[3].setValue('');
}
},
};
//区
var comboArea = {
xtype: 'combobox',
editable: true,
allowBlank: true,
forceSelection: true,
name: 'area',
width: me.width,
labelWidth: 15,
fieldLabel: '区',
//emptyText: '请选择区',
labelAlign: 'right',
store: storeArea,
displayField: 'REGION_NAME',
valueField: 'REGION_NAME',
triggerAction: 'all',
queryMode: 'local',
hidden: true
};
me.items = [];
me.items.push(comboCountry);
me.items.push(comboProvince);
me.items.push(comboCity);
me.items.push(comboArea);
me.callParent(arguments);
},
/*设置值*/
setValue: function (value) {
var me = this;
var values = value.split(',');
var items = me.getBoxes();
for (var i = 0; i < values.length; i++) {
if (values[i] != null && values[i] !='') {
items[i].setValue(values[i]).fireEvent('select', items[i], [items[i].findRecord("REGION_NAME", values[i])]);
}
}
return me;
},
/*获取值*/
getValue: function () {
var me = this;
var values = [];
var value = '';
Ext.each(me.getBoxes(), function (item) {
if (item.getValue() != null) {
values.push(item.getValue());
}
});
for(var i=0;i<values.length;i++)
{
value += values[i];
if (i < values.length - 1)
{
value += ',';
}
}
return value;
},
/*取得项*/
getBoxes: function () {
return this.query('[xtype=combobox]');
},
});