1. #1
    Sencha User
    Join Date
    Aug 2011
    Location
    china
    Posts
    7
    Vote Rating
    0
    zhxhdean is on a distinguished road

      0  

    Question Answered: ExtJS 4 combo load data

    Answered: ExtJS 4 combo load data


    <script type="text/javascript">


    Ext.onReady(function () {



    Ext.define("dflModel", {
    extend: "Ext.data.Model",
    fields: [
    { name: "id", type: "int" },
    { name: "text", type: "string" }
    ]
    });


    var states = Ext.create('Ext.data.Store', {
    model: "dflModel",
    proxy: {
    url: "loaddata.ashx",
    type: "ajax"
    }
    ,autoLoad: true
    })
    var defaults = Ext.create('Ext.data.Store', {
    fields: ['id', 'text'],
    data: []
    })


    var panel = Ext.create('Ext.form.Panel', {
    id: 'formcom',
    title: 'combo',
    width: 500,
    frame: true,
    renderTo: Ext.getBody(),
    defaultType: 'combo',
    items: [{
    id: 'combo1',
    xtype: 'combo',
    fieldLabel: 'city',
    labelWidth: 20,
    emptyText: 'select',
    editable: false,
    queryMode: 'local',
    store: states,
    displayField: 'text',
    valueField: 'id',
    listeners: {
    select: function (combo, record, index) {
    scombox.clearValue();
    scombox.store = new Ext.data.Store({
    model: 'dflModel',
    proxy: {
    url: "loaddata.ashx?cityid=" + combo.value,
    type: "ajax"
    }
    ,autoLoad: true
    });
    defaults.load();
    }
    }
    }]
    })


    var scombox = Ext.create('Ext.form.field.ComboBox', {
    id: 'combo2',
    fieldLabel: 'area',
    labelWidth: 20,
    store: defaults,
    editable: false,
    queryMode: 'local',
    displayField: 'text',
    valueField: 'id',
    margin: '-2 0 0 180',
    emptyText: 'select',
    triggerAction: 'all',
    renderTo: Ext.getCmp('formcom').getEl() //Ext.getBody()//
    })


    })




    </script>


    Server Data
    [{"id":11,"text":"beijing"},{"id":12,"text":"shanghai"},{"id":13,"text":"guangzhou"}]

    first combo can load data ,when onselect server side data send to client but second combo can't load data

    my english poor , thx

  2. OK, problem solved.

    ExtJS 4.0.2 didn't have a getStore() method, the docs are for 4.0.6. You'll have to use scombox.store instead.

  3. #2
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,625
    Vote Rating
    331
    Answers
    550
    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 use CODE tags when posting code (# button on the editor toolbar).

    There may well be other problems but the first problem I see is this line:

    Code:
    scombox.store = new Ext.data.Store({
    If you want to change the store you'd need to call bindStore() but in your case you're only changing a request parameter so you could do something like this instead:

    Code:
    // Configure the store for scombox properly from the outset
    var defaults = Ext.create('Ext.data.Store', {
        model: 'dflModel',    
        proxy: {
            type: 'ajax',
            url: 'loaddata.ashx'
        }
    });
    
    ...
    
    select: function(combo, record, index) {
        scombox.clearValue();
        
        scombox.getStore().load({
            cityid: combo.getValue()
        });
    }

  4. #3
    Sencha User
    Join Date
    Aug 2011
    Location
    china
    Posts
    7
    Vote Rating
    0
    zhxhdean is on a distinguished road

      0  

    Default


    first thank you for answer my question.

    i use scombox.getStore() ,but javascript error message:'Object [object Object] has no method 'getStore'' ,view the Extjs4 document ,combox has getStore(). why ??

  5. #4
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,625
    Vote Rating
    331
    Answers
    550
    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


    My guess would be that scombox isn't the combobox you think it is. Try adding:

    Code:
    console.dir(scombox);
    In either Firebug or Chrome that should give you enough info to figure out what scombox actually is.

    Have a look through your code for places where the variable scombox is assigned, make sure it only happens the once.

  6. #5
    Sencha User
    Join Date
    Aug 2011
    Location
    china
    Posts
    7
    Vote Rating
    0
    zhxhdean is on a distinguished road

      0  

    Default


    i use chrome ,document.write(scombox), scombox is "Ext.Class.Class.newClass",
    iuse extjs 4.0.2a, maybe it's bug ?

  7. #6
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,625
    Vote Rating
    331
    Answers
    550
    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


    I don't think it is a bug in ExtJS, I'm pretty sure it's a bug in your code.

    If you're using Chrome, inside the select listener use either console.log(scombox) or console.dir(scombox) then dig into the object in the console to figure out what it is. document.write() won't tell you anything useful.

  8. #7
    Sencha User
    Join Date
    Aug 2011
    Location
    china
    Posts
    7
    Vote Rating
    0
    zhxhdean is on a distinguished road

      0  

    Default


    i listen to your views,use console.log
    QQ截图20110902102554.png1.png

  9. #8
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,625
    Vote Rating
    331
    Answers
    550
    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


    OK, problem solved.

    ExtJS 4.0.2 didn't have a getStore() method, the docs are for 4.0.6. You'll have to use scombox.store instead.

  10. #9
    Sencha User
    Join Date
    Aug 2011
    Location
    china
    Posts
    7
    Vote Rating
    0
    zhxhdean is on a distinguished road

      0  

    Default


    thank you very much.
    problem solved.

    select: function (combo, record, index) {

    scombox.clearValue();

    scombox.store.load({
    params: { cityid: combo.value}
    })
    }

  11. #10
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,625
    Vote Rating
    331
    Answers
    550
    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 can you mark the thread as Answered?

Thread Participants: 1