load event not firing in jsonstore

team,

I'm having a jsonstore to load my list. I'm loading store using inline data without any proxy config. I wanted to call load event of my store. Kindly let me know how to do it.

Below is my store code:

Store = new Ext.data.JsonStore({ mode开发者_Python百科l : 'SettingModel',

getGroupString:function(){
        return 'Set Duration';
        },
autoLoad:false,     
data: [
    {name: '5 mins',   value: '5'},
    {name: '15 mins',   value: '15'},
    {name: '25 mins',   value: '25'},
    {name: '45 mins',   value: '45'}
],
listeners : {
    'load': function(){
        Ext.Msg.alert('App',"load");
    }
}});

Store.load();

with the above code i get the following error message : "Uncaught Error: You are using a ServerProxy but have not supplied it with a url"

if i remove the "Store.load();" line, im not getting error and list is populating with data. But the load event is not fired.

Kindly help me how to make load event to fire in this scenario.

Thanks in Advance

The load event is not called when data is inline. Also, the load method should only be called when data has to be accessed using an AJAX request (that's why an url for a proxy is needed when you call the .load() method).

Try using the loadData method to load inline data, instead of passing it in the object constructor and the datachanged event if you want to listen each time loadData is called.

Ext seems to be pushing for stores to be used with models etc. It feels like, because you are using a store, it expects you to do an ajax call to get the data. You can overwrite this by specifying a proxy:

        proxy: {
            type: 'memory',
            reader: {
                type: 'json',
                root: 'items'
            }
        },

Straight from the Ext docs for store: http://dev.sencha.com/deploy/touch/docs/

Ext.regModel('User', {
fields: [
    {name: 'firstName', type: 'string'},
    {name: 'lastName',  type: 'string'},
    {name: 'age',       type: 'int'},
    {name: 'eyeColor',  type: 'string'}
]
});

oh look, they don't have a memory proxy in their local store!

new Ext.data.Store({
model: 'User',
data : [
    {firstName: 'Ed',    lastName: 'Spencer'},
    {firstName: 'Tommy', lastName: 'Maintz'},
    {firstName: 'Aaron', lastName: 'Conran'},
    {firstName: 'Jamie', lastName: 'Avins'}
]
}); 

And as a fun bonus, JsonStore isn't even in the touch docs.

http://jsfiddle.net/6WV3m/3/ is extjs 4.0 code, but it works on my touch locally.

First, you need to make sure your Store is being used. You have autoLoad:false, so it will not load on its own. The component you are binding it to must then load it, or you must call it's load method. Also, you should check for the exception states.

Usually you want to go in the following format:

listeners : {
    load : {
            fn : function(){
                    Ext.Msg.alert('App',"load");
            },
            scope : this
        },
    exception : {
            fn : function( err ){
                    Ext.Msg.alert('App',"Oh Crap!"+err);
            },
            scope : this
        }
}

This way you can control the function and the scope, which is a frequent issue,

pablodcar's answer should really do for you. You may instantiate your store with an empty data array and then call the loadData() method with the data array you want to load. This method can be called from any where if you initiate your store with a storeId and then look-it up using Ext.data.StoreManager.lookup(storeId).

To be notified whenever the store data is changed, you may listen to the datachanged event.