Dynamic dependant combo box

[leduc]

Hello all,

What I want:

Several dependants combo box which are populate at each selection change.
--> For a country and a departement, no problem, One request and we found them.
Imagine my case with changing list like... Student in Classroom ?
When I click the classroom, I need students are in. So, every half hour the combo list must change.

What I have:
First load, all it's ok: If I choose chemistry classroom by default, I get the good people.
I click on biologie classroom, my combo box for people is well updated.
But, as soon as I click on my second list, If I come back to first one and change classroom name, the second list is not updated...

My Code:

var MyForm = Ext.extend(Ext.form.FormPanel,
[...]
        var config         = 
        {
                 ,items        :    [
                 {
                      xtype        :    'fieldset'
                     ,title        :   'Class room Name'
                     ,defaults    :    {layout        :    'form'}
                     ,items        :
                     {
                             id                 :     this.id + '-classroomlist'
                             ,name            :     'classroomlist'                
                             ,fieldLabel     :     'Select Room Name)
                             ,xtype           :    'combo'
                             ,store            :     My.utils.comboStore('classroomlist', this.currentInfos)
                             ,mode            :     'local'
                             ,displayField    :     'translation'
                             ,valueField        :    'value'
                             ,triggerAction    :    'all'
                             ,typeAhead        :    true
                             ,lazyRender        :    true
                             ,listeners        :    
                           {
                                   select        :    function(combo, record, index)
                                  {
                                        thisForm.currentInfos =    record.get(combo.valueField);
                                        var projectCombo    =    Ext.getCmp(thisForm.id + '-peoplelist');
                                        var projectCombo.store = My.utils.comboStore('peoplelist', this.currentInfos);
                                        projectCombo.store.on('load', function(store)
                                        {
                                               projectCombo.setValue(store.getAt(0).get('value'), true);
                                        });
                                  }
                       }
                  }]
              },{
                xtype        :    'fieldset'
                ,title        :    'People List'
                ,defaults    :    {layout        :    'form'}
                ,items        :    [
                  {
                        id                 :     this.id + '-peoplelist'
                       ,name            :     'peoplelist'                
                       ,fieldLabel        :     'Select People Name'
                       ,store            :     My.utils.comboStore('peoplelist', this.currentInfos)
                       ,mode            :     'local'
                       ,displayField    :     'translation'
                       ,valueField        :    'value'
                       ,triggerAction    :    'all'
                       ,typeAhead        :    true
                       ,lazyRender        :    true
[...]

// Other where in the code:

(function(){ // start of local scope

    My.utils = My.utils || {}; 
    My.utils.comboStore = function( sFieldName , sParams) 
    {
        var fieldComboStore     =    new Ext.data.ArrayStore(
        {
            autoLoad    :    true
            ,fields        :    ['value', 'translation','tooltip']
            ,url        :    'common/getcombolistfromfield?ajax=1'
            ,baseParams :    {
                fieldName         :    sFieldName
                ,param              :    sParams
            }
        });
        return fieldComboStore; 
    };

})(); // end of local scop

What I think:
When I click on the second list, maybe I change a params on the store, or I block it and so after I can reload it normally. !?!
I don't understand why all it's ok a the first change and what it's not ok after a click on the second list...

Please help me !!! ;-(

[leduc]

I find an interesting thing:

In my combo listener, I had try the expand event to force the store.load.
Exactly same problem:
Build list: ok
Change value in first list, combo store is well updated. If I click on the second list, I have a little waiting message and after the good list dependant of the first one.
After this load, I can make select on first list nothing is done, the second list keep the list charged before I can not access to the store.load with the little waiting message...

So, for a combo, we can use a different store only one time, after it was expand one time, we can not access to the new store.

Is it a normal way for you?

[paulharv]

I don't quite know what problem you are having but I have built dynamic combos in a grid.
Each combo has it's own store, and when the one changes I reset the value of the subsequent ones to [Please Choose]. I do this by handling the combo's change event.

In the second and third (etc) combos I handle the beforequery event where I set the store's baseParams to with the value from the previous combo, then I call the store's load() method.


This has worked for me at any rate.

Also, you may find these posts helpful...
http://www.sencha.com/forum/showthre...bo-Box-Example
http://www.webeks.net/extjs/dynamic-...-combobox.html
http://stackoverflow.com/questions/3...ditorgridpanel

[leduc]

Hello paulharv,

Thank you for your reply, I just arrived to same conclusion :
I can not change completely the store, this just work one time; BUT I can access to the baseParams of my store, change it, at each store.load it take new baseParams value, exactly what I want !!!

Thank you very much for your time.

Have a nice day.