Flexmonster supports creating multilevel hierarchies from non-hierarchical data out of the box. To use this feature for the custom data source API, you need to handle certain request scenarios on your server.
This guide describes how to support multilevel hierarchies on your server and configure them in the component.
Hierarchies are composed on the client side while the server’s task is to filter them. For this purpose, your back end has to implement advanced hierarchical filters.
In version 2.8.5, the Filter Object describes the structure of the filters sent by the component.
exclude.filter properties of the Filter Object are responsible for filtering hierarchical data. Therefore, implement them to enable the support of multilevel hierarchies on your server.
When the server implements hierarchical filters, it should inform the component about that.
For this purpose, set the advanced property of the /fields request to
true. The component will ignore multilevel hierarchies if the
advanced property is set to
The component sends the additional /select request when the
levelName property is defined in the slice. This request extracts members from the hierarchy level specified in
If you need the
levelName property in your slice, handle the /select request for loading the required hierarchy levels.
There are two ways to compose multilevel hierarchies:
The Mapping Object is responsible for grouping data into hierarchies. Specify
parent properties to structure the data.
The example below illustrates how to compose multilevel hierarchies in the report. Here, we create the
"Item" hierarchy with the
"Category" field as a first level and the
"Color" field as a second level:
// your slice
See a live example on JSFiddle.
As an alternative to the Mapping Object, you can configure hierarchies right in the response to the /fields request. To do so, specify
Here is an example of a /fields response where the
"Color" fields are grouped under the
"Item" hierarchy (with
"Category" as the top level of the hierarchy):
Now run your project and open the web page with Flexmonster – multilevel hierarchies should appear in the component.
You may be interested in the following articles: