Я нашел много примеров дерева, которые были загружены через корневые данные в хранилище, которые являются статическими или через хранилище деревьев, загружает представление дерева данных, в конечном счете загружая дерево заранее.Extjs treepanel store.load() issue
Мое требование - изначально изначально пусто, без данных, поэтому я использую removeAll в хранилище деревьев, чтобы достичь его, даже если тройник загружен.
Я использую ExtJs V 5.0.1.
Next on lick of button Я загружаю дерево методом store.load.
Данные дерева хранятся в файле json, выданном службой php rest.
Дерево загружается штрафом при нажатии кнопки. Проблема заключается в том, что все события развала или разложения только работают. То, что в моем случае первый элемент будет расширен, развалится один раз и затем не будет расширяться. Аналогично для свернутого дочернего элемента не будет разваливаться после его расширения.
Добавление мой код ниже
Ext.define('TestTheme2.controller.Controller', {
extend: 'Ext.app.Controller',
requires: [
'Ext.window.MessageBox'
],
stores: [
],
config: {
isGridInspected: false
},
refs: {
treeGrid: '#treegrid'
},
control: {
"#treegrid":{
afterrender: 'afterViewRender'
},
"#loadButton":{
click:'onBtnClick'
}
},
afterViewRender: function(component, eOpts){
this.getTreeGrid().getStore().removeAll();
},
onBtnClick: function(){
this.getTreeGrid().getStore().load();
}
});
мой взгляд код
Ext.define('TestTheme2.view.MyTreeGrid', {
extend: 'Ext.tree.Panel',
alias: 'widget.MyTreeGrid',
requires: [
'TestTheme2.store.MyStore',
'Ext.tree.View',
'Ext.grid.column.Check',
'Ext.tree.Column',
'Ext.grid.column.Widget',
'Ext.button.Button',
'Ext.menu.Menu',
'Ext.menu.Item',
'Ext.data.*',
'Ext.grid.*',
'Ext.tree.*',
],
itemId: 'treegrid',
width: '',
title: '',
allowDeselect: true,
enableColumnHide: false,
rowLines: true,
scroll: 'vertical',
sortableColumns: false,
store: 'MyStore',
rootVisible: false,
viewConfig: {
itemId: 'mytreeview2',
enableTextSelection: false,
markDirty: false,
stripeRows: true,
animate: true
},
columns: [
{
xtype: 'checkcolumn',
itemId: 'mycheck',
width: 50,
sortable: false,
dataIndex: 'mark',
text: ''
},
{
xtype: 'treecolumn',
width: 120,
sortable: false,
dataIndex: 'year',
text: 'Year',
flex: 1
},
{
xtype: 'gridcolumn',
width: 120,
sortable: false,
dataIndex: 'week',
text: 'Week'
},
{
xtype: 'gridcolumn',
width: 110,
sortable: false,
dataIndex: 'startdate',
text: 'Start Date'
},
{
xtype: 'gridcolumn',
width: 110,
sortable: false,
dataIndex: 'enddate',
text: 'End Date'
}
]
});
Мой магазин Код
Ext.define('TestTheme2.store.MyStore', {
extend: 'Ext.data.TreeStore',
requires: [
'TestTheme2.model.MyModel'
],
constructor: function(cfg) {
var me = this;
cfg = cfg || {};
me.callParent([Ext.apply({
storeId: 'MyStore',
model: 'TestTheme2.model.MyModel',
proxy: {
type: 'ajax',
url: '../../PhpWS/MockRestFlow?Service=MyService&type=byweek'
}
}, cfg)]);
}
});
Мой код Модель
Ext.define('TestTheme2.model.MyModel', {
extend: 'Ext.data.Model',
requires: [
'Ext.data.field.Field'
],
fields: [
{
name: 'year'
},
{
name: 'week'
}
{
name: 'startdate'
},
{
name: 'enddate'
}
{
name: 'mark'
}
]
});
Мои Json Файл
{
text: '.',
children: [
{
year: 2014,
week: 33,
synergyid: '',
startdate: '01/11/2014',
enddate: '02/11/2014',
mark: false,
expanded: true,
children: [
{
year: 2014,
week: 33,
startdate: '03/11/2014',
enddate: '04/11/2014',
mark: false,
leaf: true
},
{
year: 2014,
week: 33,
startdate: '05/11/2014',
enddate: '06/11/2014',
mark: false,
leaf: true
},
{
year: 2014,
week: 33,
startdate: '07/11/2014',
enddate: '08/11/2014',
mark: false,
leaf: true
}
]
},
{
year: 2014,
week: 34,
startdate: '09/11/2014',
enddate: '10/11/2014',
expanded: false,
mark: false,
children: [
{
year: '2014',
week: 34,
startdate: '11/11/2014',
enddate: '12/11/2014',
mark: false,
leaf: true
},
{
year: 2014,
week: 34,
startdate: '13/11/2014',
enddate: '14/11/2014',
mark: false,
leaf: true
},
{
year: 2014,
week: 34,
startdate: '15/11/2014',
enddate: '16/11/2014',
mark: false,
leaf: true
}
]
},
{
year: 2014,
week: 35,
startdate: '17/11/2014',
enddate: '18/11/2014',
mark: false,
expanded: false,
children: [
{
year: 2014,
week: 35,
startdate: '19/11/2014',
enddate: '20/11/2014',
mark: false,
leaf: true
},
{
year: 2014,
week: 35,
startdate: '21/11/2014',
enddate: '22/11/2014',
mark: false,
leaf: true
},
{
year: 2014,
week: 35,
startdate: '23/11/2014',
enddate: '24/11/2014',
mark: false,
leaf: true
}
]
},
{
year: 2014,
week: 36,
startdate: '17/11/2014',
enddate: '18/11/2014',
mark: false,
expanded: false,
children: [
{
year: 2014,
week: 36,
startdate: '19/11/2014',
enddate: '20/11/2014',
mark: false,
leaf: true
},
{
year: 2014,
week: 36,
startdate: '21/11/2014',
enddate: '22/11/2014',
mark: false,
leaf: true
},
{
year: 2014,
week: 36,
startdate: '23/11/2014',
enddate: '24/11/2014',
mark: false,
leaf: true
}
]
},
{
year: 2014,
week: 37,
startdate: '17/11/2014',
enddate: '18/11/2014',
mark: false,
expanded: false,
children: [
{
year: 2014,
week: 37,
startdate: '19/11/2014',
enddate: '20/11/2014',
mark: false,
leaf: true
},
{
year: 2014,
week: 37,
startdate: '21/11/2014',
enddate: '22/11/2014',
mark: false,
leaf: true
},
{
year: 2014,
week: 37,
startdate: '23/11/2014',
enddate: '24/11/2014',
mark: false,
leaf: true
}
]
},
{
year: 2014,
week: 37,
startdate: '17/11/2014',
enddate: '18/11/2014',
mark: false,
expanded: false,
children: [
{
year: 2014,
week: 37,
startdate: '19/11/2014',
enddate: '20/11/2014',
mark: false,
leaf: true
},
{
year: 2014,
week: 37,
startdate: '21/11/2014',
enddate: '22/11/2014',
mark: false,
leaf: true
},
{
year: 2014,
week: 37,
startdate: '23/11/2014',
enddate: '24/11/2014',
mark: false,
leaf: true
}
]
}
]
}
Не удается сделать это: «Ext.data.proxy.Server.buildUrl(): вы используете ServerProxy, но не указали его с URL-адресом». – Ameya
Хорошо немного отредактируйте свой ответ. Мы не должны использовать прокси-сервер в определении хранилища, иначе он даст ошибку, как я сказал выше. Кабина выполнена store.load ({url: 'myurl'}) ;. Это сработало для меня :) – Ameya