PDA

View Full Version : [SOLVED] Linked Combobox Problem



yagi
22 Jun 2010, 8:00 PM
Hi all..

I'm facing problem with my combobox, I'm using Codeigniter and Extjs.

I have 2 linked combobox, They are Site, and Fleet. When I select site that has fleet, Fleet combobox loads data depending on the selected site but when I select site that has no fleet, fleet combobox loads the earlier data (it should load no data because the site has no fleet).

I've tried to debug it using firebug, but there is no error.It runs well, firebug response shows that no data loaded (in case, the site has no fleet) :-/.

Here is my snippet code :


newhid.core.vims_comp_group.comboStoreSite = Ext.extend(Ext.data.JsonStore, {
constructor: function(config){
config = config || {};
config.pruneModifiedRecords= true,

config.url = config.url || (baseHref + newhid.core.vims_comp_group.controller+'/getSite');
config.root = config.root || 'rows';
config.fields = [
{name: 'idsite', mapping: 'idsite'},
{name: 'sitename', mapping: 'sitename'}
];
config.autoLoad = true;

newhid.core.vims_comp_group.comboStoreSite.superclass.constructor.call(this, config);
}
});

newhid.core.vims_comp_group.comboStoreFleet = Ext.extend(Ext.data.JsonStore, {
constructor: function(config){
config = config || {};
// config.pruneModifiedRecords= true,
config.url = config.url || (baseHref + newhid.core.vims_comp_group.controller+'/getFleet');
config.root = config.root || 'rows';
config.fields = [
{name: 'idfleet', mapping: 'idfleet'},
];

newhid.core.vims_comp_group.comboStoreFleet.superclass.constructor.call(this, config);
}
});

newhid.core.vims_comp_group.form = Ext.extend(Ext.form.FormPanel,{
constructor: function(config)
{
config = config||{};
config.labelWidth = config.labelWidth || 100;
config.frame = config.frame || true;
config.autoHeight = config.autoHeight || true;
config.title = config.title || 'VIMS Component Management';
config.bodyStyle = config.bodyStyle || 'padding:10px 10px 10px';
config.width = config.width || 700;
config.defaults = {width: 700},
// config.plain = false,
//config.defaultType = 'textfield';
config.border = config.border || false;
newhid.core.vims_comp_group.form.superclass.constructor.call(this, config);

},
initComponent: function()
{
Ext.apply(this,{
items:[{
layout:'column',
items:[{
columnWidth:.50,
labelWidth:40,
layout: 'form',
items: [
{
xtype:'combo',
fieldLabel: 'Site',
id:'siteCombo',
store: new newhid.core.vims_comp_group.comboStoreSite(),
name: 'idsite',

displayField : 'sitename',
mode:'remote',
valueField : 'idsite',
hideTrigger:false,
triggerAction : 'all',
minChars:2,width: 200,
typeAhead : true,
loadingText: 'Please Wait...',
forceSelection : true,
emptyText : 'Select Site',

selectOnFocus : true,
allowBlank: false,
listeners:{
'select' :function(cmb, rec, idx)
{
fleet = Ext.getCmp('fleetCombo');
fleet.clearValue();
fleet.store.load({
params:{'site': Ext.getCmp('siteCombo').getValue()}
});

prefix = Ext.getCmp('prefixCombo');
}
}
},{
xtype:'combo',
fieldLabel: 'Fleet',
id:'fleetCombo',
name: 'idfleet',width: 200,
store: new newhid.core.vims_comp_group.comboStoreFleet(),
displayField : 'idfleet',
mode:'local',
valueField : 'idfleet',
editable: false,
emptyText: 'Select Fleet',
triggerAction: 'all',
loadingText: 'Please Wait...',
listeners:{
'select' :function(cmb, data, idx)
{
prefix = Ext.getCmp('prefixCombo');
prefix.clearValue();
prefix.store.load({
params:{'site': Ext.getCmp('siteCombo').getValue(),
'fleet' : Ext.getCmp('fleetCombo').getValue()
}
});

}
}
}]
}],
buttons:[
{
text: 'Save',
iconCls:'icon-disk ',
listeners:
{
click:
{
scope: this,
fn: saveVIMS_comp_group
}
}
},
});
Here is my screenshot :
(Site [Adaro 76] that has fleet)
21058

(Site [ATA] that has no fleet)
21059

Can someone help me to solve this?

Thanks..

Mark
22 Jun 2010, 10:39 PM
Try to use a Proxy in your store.
Like this:

PromoType.store.combo = Ext.extend(Ext.data.Store,
{
constructor: function(config) {
PromoType.store.combo.superclass.constructor.call(this, Ext.apply
(
{
proxy: new Ext.data.HttpProxy(
{
url: '.....',
method: 'POST'
}
),
reader: new Ext.data.JsonReader(
{
id: 'ID',
root: 'data',
totalProperty:'total',
fields:[
....
]
}
),
writer: new Ext.data.JsonWriter(
{
encode: false
}
),
baseParams: {....}
// autoLoad: true
}, config
)
);
}
}
);than recall Ext.data.HttpProxy() before you load



fleet.clearValue();
fleet.store.baseParams = {'site': Ext.getCmp('siteCombo').getValue(),
'fleet' : Ext.getCmp('fleetCombo').getValue()
};
fleet.store.proxy = new Ext.data.HttpProxy(
{
url: '....',
method: 'POST'

}
);
fleet.store.load();
Good Luck!:)

yagi
23 Jun 2010, 12:00 AM
Hi Mark.., Thanks for your reply :).

I have tried your code but it still doesn't work.

Here is my new code :


newhid.core.vims_comp_group.comboStoreSite = Ext.extend(Ext.data.Store,
{
constructor: function(config) {
newhid.core.vims_comp_group.comboStoreSite.superclass.constructor.call(this, Ext.apply
(
{
proxy: new Ext.data.HttpProxy(
{
url: newhid.core.vims_comp_group.controller+'/getSite',
method: 'POST'
}
),
reader: new Ext.data.JsonReader(
{
id: 'ID',
root: 'rows',
totalProperty:'total',
fields:[
{name: 'idsite', mapping: 'idsite'},
{name: 'sitename', mapping: 'sitename'}
]
}
),
}, config
)
);
}
}
);

newhid.core.vims_comp_group.comboStoreFleet = Ext.extend(Ext.data.Store,
{
constructor: function(config) {
newhid.core.vims_comp_group.comboStoreSite.superclass.constructor.call(this, Ext.apply
(
{
proxy: new Ext.data.HttpProxy(
{
url: newhid.core.vims_comp_group.controller+'/getFleet',
method: 'POST'
}
),
reader: new Ext.data.JsonReader(
{
id: 'ID',
root: 'rows',
totalProperty:'total',
fields:[
{name: 'idfleet', mapping: 'idfleet'}
]
}
),

}, config
)
);
}
}
);

newhid.core.vims_comp_group.form = Ext.extend(Ext.form.FormPanel,{
constructor: function(config)
{
config = config||{};
config.labelWidth = config.labelWidth || 100;
config.frame = config.frame || true;
config.autoHeight = config.autoHeight || true;
config.title = config.title || 'VIMS Component Management';
config.bodyStyle = config.bodyStyle || 'padding:10px 10px 10px';
config.width = config.width || 700;
config.defaults = {width: 700},
// config.plain = false,
//config.defaultType = 'textfield';
config.border = config.border || false;
newhid.core.vims_comp_group.form.superclass.constructor.call(this, config);

},
initComponent: function()
{
Ext.apply(this,{
items:[{
layout:'column',
items:[{
columnWidth:.50,
labelWidth:40,
layout: 'form',
items: [
{
// allowBlank: false,
xtype:'combo',
fieldLabel: 'Site',
id:'siteCombo',
store: new newhid.core.vims_comp_group.comboStoreSite(),
name: 'idsite',

displayField : 'sitename',
mode:'remote',
valueField : 'idsite',
hideTrigger:false,
triggerAction : 'all',
minChars:2,width: 200,
typeAhead : true,
loadingText: 'Please Wait...',
forceSelection : true,
emptyText : 'Select Site',
selectOnFocus : true,
allowBlank: false,
listeners:{
'select' :function(cmb, rec, idx)
{
fleet = Ext.getCmp('fleetCombo');
fleet.clearValue();
// fleet.store.load({
// params:{'site': Ext.getCmp('siteCombo').getValue()}
// });

fleet.store.baseParams = {
'site': Ext.getCmp('siteCombo').getValue()
};

fleet.store.proxy = new Ext.data.HttpProxy(
{
url: newhid.core.vims_comp_group.controller+'/getFleet',
method: 'POST'

}
);
fleet.store.load();

prefix = Ext.getCmp('prefixCombo');
}
}
},{
xtype:'combo',
fieldLabel: 'Fleet',
id:'fleetCombo',
name: 'idfleet',width: 200,
store: new newhid.core.vims_comp_group.comboStoreFleet(),
displayField : 'idfleet',
mode:'local',
valueField : 'idfleet',
editable: false,
emptyText: 'Select Fleet',
triggerAction: 'all',
loadingText: 'Please Wait...',
listeners:{
'select' :function(cmb, data, idx)
{
prefix = Ext.getCmp('prefixCombo');
prefix.clearValue();
prefix.store.load({
params:{'site': Ext.getCmp('siteCombo').getValue(),
'fleet' : Ext.getCmp('fleetCombo').getValue()
}
});
prefix.enable();

}
}
}]
Is there any mistakes in my code?

yagi
23 Jun 2010, 12:17 AM
Hi Mark...

I know where the problem is. it is in removeAll() function.
I didn't use it to remove my record store.

Now my combobox has run well.

Thanks Mark:)