ParentId on Root Element of TreeView

Hi  

I am generating the Treeview nodes data from an Web Json API and the data looks like below,  The issue here is that the treeview root element does not take pid = 0. Is this a bug?  Thank you.

ERROR TypeError: Cannot read property 'split' of undefined
    at Function.EventHandler.remove (VM73880 event-handler.js:41)
    at TreeViewComponent.TreeView.wireExpandOnEvent (VM73944 treeview.js:2129)
    at TreeViewComponent.TreeView.unWireEvents (VM73944 treeview.js:2160)
    at TreeViewComponent.TreeView.destroy (VM73944 treeview.js:2277)
    at TreeViewComponent.Component.refresh (VM73886 component.js:78)
    at MainpageComponent.ngOnInit (VM73869 mainpage.component.ts:101)
    at checkAndUpdateDirectiveInline (VM73554 core.js:12291)
    at checkAndUpdateNodeInline (VM73554 core.js:13794)
    at checkAndUpdateNode (VM73554 core.js:13737)
    at debugCheckAndUpdateNode (VM73554 core.js:14609)

 public field: Object = { dataSource: this.Data, id: 'id', parentID: 'pid', text: 'name', hasChildren: 'hasChild' };

 [
    { id: 1, pid: 0, name: 'Discover Music', hasChild: true, expanded: true },
    { id: 2, pid: 1, name: 'Hot Singles' },
    { id: 3, pid: 1, name: 'Rising Artists' },
    { id: 4, pid: 1, name: 'Live Music' },
    { id: 7, pid: 0, name: 'Sales and Events', hasChild: true },
    { id: 8, pid: 7, name: '100 Albums - $5 Each' },
    { id: 9, pid: 7, name: 'Hip-Hop and R&B Sale' },
    { id: 10, pid: 7, name: 'CD Deals' },
    { id: 11, pid: 0, name: 'Categories', hasChild: true },
    { id: 12, pid: 11, name: 'Songs' },
    { id: 13, pid: 11, name: 'Bestselling Albums' },
    { id: 14, pid: 11, name: 'New Releases' },
    { id: 15, pid: 11, name: 'Bestselling Songs' },
    { id: 16, pid:0, name: 'MP3 Albums', hasChild: true },
    { id: 17, pid: 16, name: 'Rock' },
    { id: 18, pid: 16, name: 'Gospel' },
    { id: 19, pid: 16, name: 'Latin Music' },
    { id: 20, pid: 16, name: 'Jazz' },
    { id: 21, pid: 0, name: 'More in Music', hasChild: true },
    { id: 22, pid: 21, name: 'Music Trade-In' },
    { id: 23, pid: 21, name: 'Redeem a Gift Card' },
    { id: 24, pid: 21, name: 'Band T-Shirts' }
    ];

1 Reply

PR Piramanayagam Ramakrishnan Syncfusion Team November 30, 2017 12:11 PM UTC

Hi Albert, 
 
Thanks for using our products.   
   
We currently use null value as the root level nodes in Essential JS2 TreeView component. Also, we will consider root level nodes if you not specify any parent id for nodes. We have provided an option to render the TreeView nodes with ID as ‘0’. So, it does not take parentID as ‘0’ for rendering root level nodes.    
   
For your reference, we have prepared a sample based on this in the link: http://plnkr.co/edit/m2HUTVaKNi4qDImfXAR5?p=preview   
   
Please let us know if you have any other concerns.   
 
Regards, 
Piramanayagam R 


Loader.
Up arrow icon