日期:2014-05-16  浏览次数:20391 次

EXTJS4两个ComboBox的数据源联动,解决遇到第二个ComboBox第二次以后显示忙的状态问题

定义如下【红色部分是后加上的,它是解决问题的关键】:

var bu_store = Ext.create('Ext.data.Store', {
fields: ['key', 'value'],
remoteSort: true, //是否在服务端排序
proxy: {
type: 'ajax', //异步获取数据,这里的URL可以改为任何动态页面,只要返回JSON数据即可
url: 'soc/GetBU',
reader: {
root: 'items'
},

simpleSortMode: true
}
});
var evt_bu = new Ext.form.ComboBox({
id: 'evt_bu',
fieldLabel: 'BU',
width: 240,
store: bu_store,
displayField: 'value',
valueField: 'key',
triggerAction: 'all',
emptyText: '请选择...',
allowBlank: false,
blankText: '请选择BU',
editable: false,
mode: 'local', //该属性和以下方法为了兼容ie8
listeners: {
'render': function () {
bu_store.load();
}
}
});

var pdl_store = Ext.create('Ext.data.Store', {
fields: ['key', 'value'],
remoteSort: true, //是否在服务端排序
autoLoad: false,
proxy: {
type: 'ajax', //异步获取数据,这里的URL可以改为任何动态页面,只要返回JSON数据即可
url: 'soc/GetPDL',
reader: {
root: 'items'
},

simpleSortMode: true
}
});

pdl_store.on("beforeload", function () {
Ext.apply(pdl_store.proxy.extraParams, {'bu': evt_bu.getValue()});
});

var evt_pdl = new Ext.form.ComboBox({
fieldLabel: '      产品线',
width: 240,
store: pdl_store,
listConfig: {loadMask: false}, 
displayField: 'value',
valueField: 'key',
triggerAction: 'all',
emptyText: '请选择...',
allowBlank: false,
blankText: '请选择产品线',
editable: false
});

//联动的实现
evt_bu.on('select', function () {
evt_pdl.clearValue();
try{
pdl_store.load();
}
catch(ex){
Ext.MessageBox.alert("错误","数据加载失败。");
}
});