TreePanel generated from TreeStore

Apparently, generating a treePanel from a treeStore is not 'out-of-the-box' like generating a grid or even generating tree from static json in Ext-JS.

In addition, at the moment there are not a many examples out there that explains how it should be done. Most of the examples are using a static JSON (memory). But what if you are using a store with an already-made JSON which you need to customize to be a tree?

listeners to the rescue
The way to make it happen, is to alter the store a bit.
we start by defining a store as usual:

Ext.define('MyTreeStore', {
extend: 'Ext.data.TreeStore',

config: {
someConfig: 0

constructor: function (cfg) {
var me = this;

cfg = cfg || {};
autoLoad: true,
storeId: 'MyTreeStoreID',
root: {
expanded: true
proxy: {
type: 'rest',
url: 'http://website/JsonGenerator.php'
extraParams: {
someCoolConfig: 1
reader: {
type: 'json'
// Don't want proxy to include these params in request
pageParam: undefined,
startParam: undefined
fields: ['JSONField_ID', 'JSONField_NAME'],

// ------------------------------------------------------------------------
// this is the important part:

listeners: {
append: function (thisNode, newChildNode, index, eOpts) {
if (!newChildNode.isRoot()) {
newChildNode.set('leaf', true);
newChildNode.set('text', newChildNode.get('JSONField_NAME'));

// ------------------------------------------------------------------------

}, cfg)]);

No comments:

Natural Language Processing :: A beginner’s (brief) guide for working on NLP problems

This article  was written for the Data Science Society's Datathon held on February 2018, as an answer to questions from the participant...