Simple List mvc style shows null

[Rui Marinho]

Helloi m trying a very simple example loading items from a local json, itry to separate concerns and following mvc style, but when i run it seems my store does't parse the items from json.

app/model/client.js:

Ext.define('Grohe.model.Client', {
    extend: 'Ext.data.Model',    config: {        idProperty: 'ID',        fields: [        { name: 'ID', type: 'int' },        { name: 'Title', type: 'string' }        ]     } });

app/store/clients.js

Ext.define('Grohe.store.Clients', {
    extend: 'Ext.data.Store',    requires: ['Grohe.model.Client'],     config: {        model: 'Grohe.model.Client',        autoLoad: true,        proxy: {            type: 'ajax',            noCache: false,            reader: { type: 'json', root: 'clients' },            url: App.Server.Url+'data/clients.json',            timeout: 15000        },        listeners: {              load: function(store, records, successful, operation, eOpts) {                                console.log("onLoadEvent called.");                                console.log("load successeful: " + successful);                            },            beforeload: function (store, operation) {             }        },        success: function(response, opts) {                console.log(response.responseText);        }       }  });

my list view:
view/client/list.js

Ext.define('Grohe.view.client.List', {
    require:['Grohe.store.Clients'],    extend: 'Ext.dataview.List',    id: 'clientList',    xtype: 'clientlist',        config: {        store: 'Clients',        itemTpl: ['{Title}',        ]                        }  });

my viewport
view/viewport.js

Ext.define('Grohe.view.Viewport', {
    extend: 'Ext.Panel',    requires: [        'Grohe.view.client.List'    ],    config: {        fullscreen: true,        layout: {            type: 'card',            animation: {                type: 'slide',                direction: 'left'            }        },               items: [{            xtype: 'clientlist'        }]    } });

my app.js

Ext.Loader.setConfig({ enabled: true, disableCaching:false });
 Ext.application({    name: 'Grohe',    icon: 'resources/img/icon.png',    glossOnIcon: false,    tabletStartupScreen: 'resources/img/splashscreen.png',     models: [        'Client'    ],     stores: [        'Clients'    ],     controllers: [        'Main'    ],        launch: function () {        Ext.create('Grohe.view.Viewport');    } });

and finaly my json file:


{ "clients": [ {"ID": "1", "Title": "Select outlet client:"}, {"ID": "2", "Title": "Lino Coelho, Lda."}, {"ID": "3", "Title": "Mat. Const. Cunha Gomes"}, {"ID": "4", "Title": "Abraão Fonseca"}, {"ID": "5", "Title": "Casa Rios - Mat de Const. Lda"}, {"ID": "6", "Title": "MACOP- Materiais de Construção"}, {"ID": "7", "Title": "Mário Ribeiro & Filhos, Lda"} ]}


So what's wrong here? i also can checkdebugging that no error is happening, only a warning about the viewport.
Any help willbe apreciate
thanks

[GFI_SI]

What is the warning? Also, you should try setting some listeners on your store to check that the data is being loaded. You can use a before load listener to check that it's instantiated and then a load listener to see if it is getting the records from the json successfully.

I'm having issues with this in a nestedlist and those steps above are what I've been using to debug my issue, but I've had no luck getting my data to show either. I also have no errors and am using MVC methodologies.

>> Edit : Forgive me, I just noticed in your store code that you are already calling listeners.

[Rui Marinho]

Yap, i m adding listeners and is firing, i also see all the scripts and resources being loaded , it's getting my local json file, but if i try insspect the store i see it's really null.. i m thinking this is something about asyncronous references to the store...
here's somre screenshots

grohesencha.jpg

[nareh tank]

give some height or flex to list if layout is vbox...i was also fetch this kind of problem...