Я взял введение в MVC (http://dev.sencha.com/deploy/ext-4.0.7-gpl/docs/index.html#!/guide/application_architecture) и попытался изменить его, чтобы вместо него загрузить сетку деревьев, с помощью приведенного здесь примера (http://dev.sencha.com/deploy/ext-4.0.0/examples/tree/treegrid.html).
Я не знаюпочему, но, похоже, он вообще не загружается. Он никогда не достигает функции запуска в Ext.application, я предполагаю, что это как-то связано с неправильной настройкой контроллера, но Firebug не показывает никаких ошибок наконсоль, так что я немного растерялся.
Для чего бы то ни было, я сам скопировал и загрузил пример TreeGrid, и он работает, так что это не проблема с ошибкой / настройкой сервера ExtJS, как я думалэто будет из этой ветки: Конфигурация, необходимая для работы примера Sencha ExtJS TreeGrid
Мой код: main.js
Ext.Loader.setConfig({ enabled: true });
Ext.require([
'Ext.data.*',
'Ext.grid.*',
'Ext.tree.*'
]);
Ext.application({
name: 'pr',
appFolder: '', //This is considered root so no name needs to be supplied.
controllers: [
'Control-Product' //filename
],
launch: function () {
console.log('The app was launched');
Ext.create('Ext.container.Viewport', {
layout: 'fit',
items: [{
xtype: 'treegrid'
}]
});
}
});
Control-Product.js
Ext.define('pr.controller.Product', {
extend: 'Ext.app.Controller',
views: ['user.TreeGrid'],
stores: ['Store-Products'],
models: ['Model-Product'],
init: function () {
console.log('The controller was instantiated');
this.control({
'viewport > panel': {
render: this.onPanelRendered
}
});
},
onPanelRendered: function () {
console.log('The panel was rendered');
}
});
TreeGrid.js
Ext.define('pr.view.user.TreeGrid', {
extend: 'Ext.tree.Panel',
alias: 'widget.treegrid',
initComponent: function () {
this.title = 'Products',
this.store = 'pr.store.Products',
this.collapsible = true,
this.useArrows = true,
this.rootVisible = false,
this.multiSelect = true,
this.singleExpand = false,
//this.renderTo = Ext.getBody(),
this.columns = [{
xtype: 'treecolumn',
text: 'ID',
flex: 1,
dataIndex: 'ID',
sortable: true
},
{
text: 'Price',
flex: 1,
dataIndex: 'Price',
sortable: true
},
{
text: 'Company',
flex: 1,
dataIndex: 'Company',
sortable: true
}];
this.callParent(arguments);
}
});
Model-Product.js
Ext.define('pr.model.Product', {
extend: 'Ext.data.Model',
fields: [
{ name: 'ID', type: 'string' },
{ name: 'Price', type: 'string' },
{ name: 'Company', type: 'string' }
]
});
Store-Products.js
Ext.define('pr.store.Products', {
extend: 'Ext.data.TreeStore',
model: 'pr.model.Product',
proxy: {
type: 'ajax',
//get data from json file for now
url: '/data/products.json'
},
folderSort: true
});
products.json
{"text":".","children": [
{
ID:'1111',
Price:'11.11',
Company:'Company1',
expanded: true,
children:[{
ID:'',
Price:'44.44',
Company:'Company2',
leaf:true
}]
},{
ID:'2222',
Price:'22.22',
Company:'Company1',
expanded: true,
children:[{
ID:'',
Price:'33.33',
Company:'Company3',
leaf:true
}]
}
]}