ExtJS - Item Selector Dynamic Store Load

Question

I am Using ExtJS 3.3.0 with CodeIgnitor 1.7.4 Using GoPHP5

I am a bit confuse what i am trying todo is:

I have a primary ItemSelector

upon choosing multiple values and shifting them to the next box (store assigned to second box)

I need an ajax or a proxy function to get an associated results to a new itemSelector.

To furture simplify:

ItemSelector 1: (I choose both these value)

US INDIA

ItemSelector 2: (I should get both countries states) AL .. CA etc plus All states or cities from India

MY CODE:

{
    xtype:'itemselector',
    fieldLabel: 'Country',
    name: 'country',
    multiselects: [{
        width: ".$width.",
        height: ".$height.",
        store: new Ext.data.ArrayStore({
            fields: ['value','text'],
            data : [".$data."]
        }),
        displayField: 'text',
        valueField: 'value'
    },{
        store: [],
        width: ".$width.",
        height: ".$height."
    }]
}

{
    xtype:'itemselector',
    fieldLabel: 'States',
    name: 'states',
    multiselects: [{
        width: ".$width.",
        height: ".$height.",
        store: new Ext.data.ArrayStore({
            fields: ['value','text'],
            data : [".$data."]
        }),
        displayField: 'text',
        valueField: 'value'
    },{
        store: [],
        width: ".$width.",
        height: ".$height."
    }]
}

Answer 1

On your first itemselector put a listener so that when an item(s) is/are selected it makes an ajax call out to the server in your case with the country code "US", "INDIA". On the server get the associated list of state codes. The return them in JSON and on return to the ajax call populate the JSONStore on the other itemselector with the state codes returned.