I want to read data from store for Extjs 4 but it shows [object object]

Question

This is my model:

data: i
0: i
data: Object
events: Object
hasListeners: k
id: "region-ext-record-344"
index: 0
internalId: "ext-record-344"
modified: Object
phantom: false
raw: Array[2] // i want to get those two elements one displayField, another valueField
0: "01"
1: "Region 1"
length: 2
__proto__: Array[0]
store: i
stores: Array[1]
__proto__: Object
1: i
2: i
3: i
length: 4
__proto__: Array[0]

I can post the code if you want to! I tried to read store like: store: regionStore, but it is showing me an empty box with 4 empty lines equal to item count in my store, then I tried to do like store: regionStore.data.items and now it shows me [object object] lines, I totally get it why, but can't find solution for that. I am new to all ExtJs stuff, I am using ExtJs 4 though.

My model looks like that :
Ext.regModel('region', { fields: [ {name: 'id', type: 'integer'}, {name: 'name', type: 'String'} });
and my store looks like that:
var regionStore = new Ext.data.ArrayStore({ id: 'regionStore', model: 'region', data: MyDesktop.GridWindow.getRegionData() //that is data from ajax response });
My combobox: { xtype: 'combobox', value: "region", store: regionStore, width: 135, id: 'regionCombo' editable: false }

Answer 1

You started off correctly, but you didn't specify which fields to use. Add the missing configuration :

store: regionStore,
valueField: 'id',
displayField: 'name'

For a combobox you can define a store inline as :

store: [[1, 'first option'], [2, 'second option']],

In this case you will not need to declare the value and the display field. They are implicit.

Answer 2

You have tagged your question extjs 4.2, but your code is old style and not following recommendations. I really recommend you to read the manual, especially the introduction to MVC.

Ext.regModel is deprecated as of version 4.0.0. Change your code as follows and save it to the file app/model/Region.js :

Ext.define('MyApp.model.Region', {
    extends: 'Ext.data.Model',
    fields: [
        {name: 'id', type: 'integer'},
        {name: 'name', type: 'string'}
    ]
});

In file app/store/Regions.js :

Ext.define('MyApp.store.Regions', {
    extends: 'Ext.data.ArrayStore',
    //id: notice that id is no longer necessary
    model: 'Region',
    //data: you load the store from the server, so the data is loaded automatically
    autoLoad: true
})

Your combobox becomes:

xtype: 'combobox', 
value: 'region',
store: 'Regions', 
width: 135,
id: 'regionCombo',
editable: false,
valueField: 'id',
displayField: 'name'

I never used extjs before 4.2, but it seems the changes introduced with version 4 are important. It may be difficult to adopt the new paradigms. But I'm sure it radically simplifies your code. You certainly never will regret this step.
Also with the release of version 5.0, I think it's time to develop new habits and leave ExtJs 2.0 coding style behind.