Not Able to load data into a listview from store in Sencha touch

Question

I am a beginner in sencha programming trying to build an app that takes in data from a remote server and displays it as a list in my app. I am trying to load data from a JSON store into a listview. My Store Code is:

Ext.define('RestaurantGlobal.store.CategoryColumnsStore', {
extend: 'Ext.data.Store',

requires: [
    'RestaurantGlobal.model.CategoryColumns'
],

config: {
    model: 'RestaurantGlobal.model.CategoryColumns',
    storeId: 'CategoryColumnsStore',
    proxy: {
        type: 'ajax',
        url: 'http://eatpunjab.gramapp.in/Data/?Model=Category&All=True',
        reader: {
            type: 'json',
            rootProperty: 'fields'
        },
    autoLoad: true
    }
  }
});

My Model Code is:

Ext.define('RestaurantGlobal.model.CategoryColumns', {
extend: 'Ext.data.Model',

uses: [
    'RestaurantGlobal.model.BaseModelColumns'
],

config: {
    fields: [
        {
            name: 'Name',
            type: 'string'
        },
        {
            name: 'Image',
            type: 'string'
        }
    ],
  }
}); 

and my view code is:

var categorystore = Ext.create("RestaurantGlobal.store.CategoryColumnsStore");
Ext.define('RestaurantGlobal.view.CategoriesPage', {
    extend: 'Ext.Panel',

config: {
    styleHtmlCls: 'maincontainer',
    styleHtmlContent: true,
    layout: {
        type: 'vbox'
    },
    items: [
        {
            xtype: 'titlebar',
            flex: 0.5,
            docked: 'top',
            title: 'Menu'
        },
        {
            xtype: 'list',
            flex: 4,
            cls:'customcontainer',
            margin: '0 10 0 10',
            itemTpl: [
             '<img src="http://eatpunjab.gramapp.in/media/{Image}" width="40" height="40"/><h2>{Name}</h2>'
            ],
            scrollToTopOnRefresh: false,
            store: categorystore
        },
     ]
   }
});

When I open the app in my browser, I get a blank listview.

What is missing in my code that is causing the data to not be loaded into the listview?

Answer 1

autoLoad is a config option for the store, but you've put it in the proxy.