ExtJS store with ajax proxy doesn't load data

Question

I am a beginner at ExtJS, and was studying the tutorials on sencha, and one just doesn't want to work (app tutorial).

I have a simple store for a grid, and when the store is using an AJAX proxy to read a json file, the data doesn't show, and according to the net tab in firebug nothing was loaded, because it is empty. And no error is thrown what so ever. But if I add a bad url for my json file, then it throws an error that it can't be found.

my store looks like this:

Ext.define('AM.store.Users', {
    extend: 'Ext.data.Store',
    model: 'AM.model.User',
    autoLoad: true,

    proxy: {
        type: 'ajax',
        url: 'data/users.json',
        reader: {
            type: 'json',
            root: 'users',
            successProperty: 'success'
        }
    }
});

my json file like this:

{
    "success": true,
    "users": [
        {"name": "Ed",    "email": "[email protected]"},
        {"name": "Tommy", "email": "[email protected]"}
    ]
}

model:

Ext.define('AM.model.User', {
    extend: 'Ext.data.Model',
    fields: ['name', 'email']
});

these are exactly the same as in the downloadable source file of the tutorial, which also don't work. If data is defined inline the store, everything is ok. Please help, completely blocked here.

Thanks!

You probably need to host the example on a server in order for the Ajax to work properly. — Eric
use the ext-all-dev.js or ext-dev.js so you have more logging. Open up your console. What does it say? You should require your model too ;) just add an extra param requires: ['AM.model.User']. Like @Eric sais are you running from a webserver? — VDP
Edited with model. Right about the server point. After I uploaded it to a server it worked perfectly. Didn't know it was needed. But for developing purposes it would be nice to have a solution to load data into the store from a external file on my computer. What would be the easiest way? Is there a proxy setup, that would work? Couldn't find anything good at first search. The data can be xml, json, array, anything, doesn't matter. — Zuller

Reimius Reimius · Accepted Answer · 2013-03-07T17:19:07

You need to do ajax calls in a server setup like Eric said. To answer the question about loading external data, you can not do that because the reason that it does not work in the first place is for security reasons, which if could be circumvented would have no point. The only way that I think you could load data from an external file would be to save the JSON data as an object in an external .js file and just use the data property of a store to set the data to that object in the external file.

ExtJS store with ajax proxy doesn't load data

1 Answers