Sencha Touch Store Complains that Model Does Not Exist - sencha-touch

Question

I created a very simple model in Sencha Touch inside the model folder:
Ext.define('Vegetable',{
extend:'Ext.data.Model',
config:{
fields:
[
{name:'title', type:'string'}
]
}
});
When I try to refer to the model inside my Main.js file it says the model does not exist.
items: [
{
xtype:'list',
title:'Home',
iconCls:'home',
store:{
model:'**VegetableTreeSenchaTouch.model.Vegetable**',
proxy:{
type:'ajax',
url:'http://vegetablegardening.com/vegetable/catalog/23',
reader:{
type:'json',
}
},
autoLoad:true
}
}
]
}
UPDATED: app.js
views:['Main'],
stores:['Vegetables'],
models:['Vegetable'],
UPDATED: Vegetables (store)
Ext.define('VegetableTreeSenchaTouch.store.Vegetables',{
extends:'Ext.data.Store',
config:{
model:'VegetableTreeSenchaTouch.model.Vegetable',
data:[
{ title: 'Onion' },
{ title: 'Potato' }
]
}
});
Any ideas?

Answer 1

Define the proxy in your store:
Ext.define('VegetableTreeSenchaTouch.store.Vegetables', {
extend: 'Ext.data.Store',
config: {
model: 'VegetableTreeSenchaTouch.model.Vegetable',
proxy: {
type: 'ajax',
url: 'http://vegetablegardening.com/vegetable/catalog/23',
reader: {
type: 'json',
}
}
},
//...
});
and use an instance of the store:
{
xtype: 'list',
title: 'Home',
iconCls: 'home',
store: 'Vegetables'
}

Answer 2

Try naming your store and model with an extended name.
Ext.define('VegetableTreeSenchaTouch.model.Vegetable',{
extend:'Ext.data.Model',
and:
Ext.define('VegetableTreeSenchaTouch.store.Vegetables',{
extends:'Ext.data.Store',
config:{
model:'VegetableTreeSenchaTouch.model.Vegetable',
data:[
{ title: 'Onion' },
{ title: 'Potato' }
]
}
});
Not certain that this is the issue, but this is always how I name my models/stores to be sure they are referenced correctly.