Displaying multiple tree columns

Ext JS 4 trees can be configured to display multiple columns for visualising advanced data structures. We will make a few minor changes to display the ID of each node in the tree. Simply adding a new column to the tree definition will achieve this purpose:

Ext.define('TTT.view.admin.CompanyTree', { extend: 'Ext.tree.Panel', xtype: 'companytree', title: 'Company -> Projects -> Tasks', requires: ['TTT.store.CompanyTree'], store: 'CompanyTree', lines: true, rootVisible: false, hideHeaders: false, viewConfig: { preserveScrollOnRefresh: true }, initComponent: function() { var me = this; Ext.applyIf(me, { tools: [{ type: 'expand', qtip: 'Expand All' }, { type: 'collapse', qtip: 'Collapse All' }, { type: 'refresh', qtip: ...

Get Enterprise Application Development with Ext JS and Spring now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.