extjs convert flat data to treestore

722 Views Asked by At

I have rest api which gives me data in this form

<plans>
    <plan id="0" title="Title 1" planGroup="group1"/>
    <plan id="1" title="Title 2" planGroup="group1"/>
    <plan id="2" title="Title 3" planGroup="group2"/>
    <plan id="3" title="Title 4" planGroup="group3"/>
</plans>

The model for my data:

Ext.define('myPlan', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'id', mapping: 'id'},
        {name: 'title', mapping: 'title'},
        {name: 'planGroup', mapping: 'planGroup'},
    ]
});

I need to display these data in tree structure like this

├── group1
│   └── Title1
│   └── Title2
└── group2
│   └── Title3
├── group3
│   └── Title4

Basically I need to create TreeStore with data like this

root: {
        expanded: true,
        text: 'root',
        children: [
            { name: 'group1', expanded: true,
                children: [
                    { name: "Title1", leaf: true },
                    { name: "Title2", leaf: true}
                ]
            },
            { name: 'group2', expanded: true,
                children: [
                    { name: "Title3", leaf: true }
                ]
            },
            { name: 'group3', expanded: true,
                children: [
                    { name: "Title4", leaf: true}
                ]
            }
        ]
    }

But I don't know how to configure the TreeStore and what functions to override to get desired result.

0

There are 0 best solutions below