Extjs treepanel store.load() issue

Я нашел много примеров дерева, которые были загружены через корневые данные в хранилище, которые являются статическими или через хранилище деревьев, загружает представление дерева данных, в конечном счете загружая дерево заранее.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 
         } 
        ] 
       } 
      ] 
     }

источник

2014-10-14 Ameya

Вместо удаления значения магазина после визуализации и снова загрузки магазина на кнопку мыши, не могли бы вы, пожалуйста, попробуйте ниже один раз, который я наткнулся на пост,

Просто определить пустой расширенный корень без детей на начальном этапе, а затем вы можете загрузить в магазине каждый раз, когда вы хотите:

Ext.create('Ext.data.TreeStore', { 
    model: '...', 
    proxy: { 
     type: 'ajax', 
     reader: { 
      type: 'json', 
      root: 'data' 
    }, 
    api: { 
     read : 'some url' 
    } 
    folderSort: true, 
    rootVisible: false, 
    root: {expanded: true, text: "", "data": []} // <- Inline root 
});

После явного .load инлайн root перезаписывается. Надеюсь, это вам поможет.

источник

2014-10-14 06:40:22 Sreek521

Не удается сделать это: «Ext.data.proxy.Server.buildUrl(): вы используете ServerProxy, но не указали его с URL-адресом». – Ameya

Хорошо немного отредактируйте свой ответ. Мы не должны использовать прокси-сервер в определении хранилища, иначе он даст ошибку, как я сказал выше. Кабина выполнена store.load ({url: 'myurl'}) ;. Это сработало для меня :) – Ameya

Extjs treepanel store.load() issue

ответ

Смежные вопросы