EXTJS4 two ComboBox data sources are linked to solve the problem of displaying busy status after the second ComboBox

The definition is as follows [the red part is appended, which is the key to solving the problem ]:

Var bu_store = Ext. create ('ext. data. store ',{
Fields: ['key', 'value'],
RemoteSort: true, // whether to sort data on the server
Proxy :{
Type: 'ajax ', // obtain data asynchronously. The URL here can be changed to any dynamic page, as long as JSON data is returned.
Url: 'soc/GetBU ',
Reader :{
Root: 'items'
},

SimpleSortMode: true
}
});
Var evt_bu = new Ext. form. ComboBox ({
Id: 'evt _ bu ',
FieldLabel: 'bus ',
Width: 240,
Store: bu_store,
DisplayField: 'value ',
ValueField: 'key ',
TriggerAction: 'all ',
EmptyText: 'select ...',
AllowBlank: false,
BlankText: 'select BU ',
Editable: false,
Mode: 'local', // This attribute is compatible with ie8 in the following ways
Listeners :{
'Render': function (){
Bu_store.load ();
}
}
});

Var pdl_store = Ext. create ('ext. data. store ',{
Fields: ['key', 'value'],
RemoteSort: true, // whether to sort data on the server
AutoLoad: false,
Proxy :{
Type: 'ajax ', // obtain data asynchronously. The URL here can be changed to any dynamic page, as long as JSON data is returned.
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: '& nbsp; product line ',
Width: 240,
Store: pdl_store,
ListConfig: {loadMask: false },
DisplayField: 'value ',
ValueField: 'key ',
TriggerAction: 'all ',
EmptyText: 'select ...',
AllowBlank: false,
BlankText: 'select product line ',
Editable: false
});

// Linkage implementation
Evt_bu.on ('select', function (){
Evt_pdl.clearValue ();
Try {
Pdl_store.load ();
}
Catch (ex ){
Ext. MessageBox. alert ("error", "data loading failed. ");
}
});