1. #1
    Sencha User
    Join Date
    Nov 2011
    Location
    Compiegne FRANCE
    Posts
    31
    Vote Rating
    0
    leduc is on a distinguished road

      0  

    Default Dynamic dependant combo box

    Dynamic dependant combo box


    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:

    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 !!! ;-(

  2. #2
    Sencha User
    Join Date
    Nov 2011
    Location
    Compiegne FRANCE
    Posts
    31
    Vote Rating
    0
    leduc is on a distinguished road

      0  

    Default


    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?

  3. #3
    Sencha User
    Join Date
    May 2010
    Posts
    101
    Vote Rating
    0
    paulharv is on a distinguished road

      0  

    Default


    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

  4. #4
    Sencha User
    Join Date
    Nov 2011
    Location
    Compiegne FRANCE
    Posts
    31
    Vote Rating
    0
    leduc is on a distinguished road

      0  

    Default


    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.

Thread Participants: 1

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi