1. #1
    Sencha User
    Join Date
    Jul 2010
    Posts
    46
    Vote Rating
    0
    proofmoore is on a distinguished road

      0  

    Default Unanswered: please show me a way

    Unanswered: please show me a way


    my need is to have comboboxes to do a thing like selecting countries and cities. when a country is selected in the first combo second combo should only show the cities which belong to that country. i did it with loading server with the country parameter. but wouldn't it be better not to request cities from the server and using a .json file or array ? my questions are how can i dynamically change the second combobox's store? or should i populate the entire combobox regarding the selection in the first combo? and which way is better here? i am confused.

    please help me in extjs 4 : )
    Last edited by proofmoore; 21 Oct 2011 at 1:15 AM. Reason: lib version

  2. #2
    Sencha User
    Join Date
    Feb 2011
    Posts
    174
    Answers
    10
    Vote Rating
    1
    netemp is on a distinguished road

      0  

    Default


    Quote Originally Posted by proofmoore View Post
    i did it with loading server with the country parameter. but wouldn't it be better not to request cities from the server and using a .json file or array ?
    What issue you think can arise if you request the cities from the server passing it the selected country as a parameter?

    You can do this by calling the load function of second combo-box in the select event of first combo-box and passing to it the selected country value.

    Hope this helps.

  3. #3
    Sencha User
    Join Date
    Jul 2010
    Posts
    46
    Vote Rating
    0
    proofmoore is on a distinguished road

      0  

    Default


    i concern about speed. i am not sure and asking which way would be faster, because in my project a user can use this menu over and over for different countries.

  4. #4
    Sencha User
    Join Date
    Feb 2011
    Posts
    174
    Answers
    10
    Vote Rating
    1
    netemp is on a distinguished road

      0  

    Default


    So as an another option, you would want to load the complete city list and store it locally and then filter this locally as per the country chosen?

    I am not very sure of how this approach would work, but you can try this by using remoteFilter:false at the store and queryMode:local at the combo. But still, I am not very sure that how the store will be filtered at the local depending upon the country selected.

    As for the speed related to the option of querying things from the server, such a method has been used for a long time with simple HTML forms and there does not occur any problem at all.

  5. #5
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,604
    Answers
    543
    Vote Rating
    325
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default


    Please don't start threads with meaningless titles like 'please show me a way'. The title should briefly describe the problem.

    Here's an example using local filtering.

    Code:
    var store = Ext.create('Ext.data.Store', {
        fields: ['country', 'city'],
        data: [
            {country: 'France', city: 'Lyon'},
            {country: 'France', city: 'Paris'},
            {country: 'Germany', city: 'Berlin'},
            {country: 'Germany', city: 'Munich'},
            {country: 'Spain', city: 'Barcelona'},
            {country: 'Spain', city: 'Madrid'}
        ]
    });
    
    Ext.create('Ext.form.field.ComboBox', {
        editable: false,
        renderTo: Ext.getBody(),
        store: ['France', 'Germany', 'Spain'],
        listeners: {
            change: function(cmb, value) {
                store.clearFilter();
                store.filter('country', value);
                cities.clearValue();
                cities.enable();
            }
        }
    });
    
    
    var cities = Ext.create('Ext.form.field.ComboBox', {
        disabled: true,
        displayField: 'city',
        editable: false,
        renderTo: Ext.getBody(),
        store: store,
        valueField: 'city'
    });

Thread Participants: 2