Fine grain control over the pivot table

Answered
Daniel Leiszen asked on November 14, 2024

In our use case the data that we need to display is a classic multi dimensional data set. Your pivot table control is a perfect match to our needs. We use an Angular frontend SPA.

Our average user capabilities are not very hight in understanding and managing multi dimensional data sets. Therefore we would like to help them by providing certain views of the data with limited manipulation options.

This means we have to show certain buttons that would configure the pivot table into another arrangement. This way we could create a step by step flow for the user to guide them through to understand the data set and make certain decisions along the way.

In terms of functionality:

  • we would like to hide the toolbar completely
  • we should be able to "re-slice" the pivot by the frontend API on button click - backend roundtrip is acceptable
  • limit the drag and drop feature to certain columns and levels of hierarchy, so the users cannot too much rearrange the view
  • limit the summarization and calculation to certain columns and rows
  • edit the numbers in certain cells or put our own input control for editing
  • single or multiple selection on specified columns or rows

Please let us know whether it is possible to use your product in such a way.

Thank you in advance

3 answers

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster November 15, 2024

Hello, Daniel!

Thank you for reaching out to us and sharing the details about your use case. We are happy to hear our component matches your needs.

Please find our comments on the requested functionality below:

1) We would like to hide the toolbar completely

Kindly note that the Toolbar is hidden by default. You can enable it if needed or add/remove/rearrange tabs.
More info about managing the Toolbar: https://www.flexmonster.com/doc/customizing-toolbar/.
You can also hide the Field List button from the grid: https://jsfiddle.net/flexmonster/xzohfgqz/.

2) We should be able to "re-slice" the pivot by the frontend API on button click - backend roundtrip is acceptable

It is possible to change the slice using your own UI controls along with our setReport() or runQuery() API calls, depending on the properties that need to be changed. We also recommend checking whether the reportcomplete event happened before further changing the report or its parts.

You can look through the full list of available API calls by the link: https://www.flexmonster.com/api/methods/.

3) Limit the drag-and-drop feature to certain columns and levels of hierarchy so the users cannot too much rearrange the view

Please note that the drag-and-drop feature can be switched off completely if needed. You can also make the gird fully read-only or restrict some of the actions, e.g., filtering, sorting or dragging: https://jsfiddle.net/flexmonster/w2e6srz9/.

4) Limit the summarization and calculation to certain columns and rows

Could you please provide us with more details about this functionality?

5) Edit the numbers in certain cells or put our own input control for editing

The editing feature is available for the flat grid: https://jsfiddle.net/flexmonster/0j0e7exa/.
Regarding our pivot grid layouts, we don't have and don't recommend editing cells that contain aggregated values, as this contradicts the pivoting logic.

6) Single or multiple selection on specified columns or rows

Kindly ask for more details about the use case here as well.

Our team recommends watching our video walkthrough on all main functionality in Flexmonster: https://youtu.be/-OgcJwnR7Mw?si=Ntib0MBr3VKldf8i.

Here is also our Angular integration guide for convenience: https://www.flexmonster.com/doc/integration-with-angular/.

Looking forward to hearing from you.
Please don't hesitate to ask if there are any further questions.

Kind regards,
Solomiia

 

Public
Daniel Leiszen November 23, 2024

Dear Solomiia,

Thank you for the elaborate answers. We are checking the examples.

I try to give you more details about the requirements we have:

5. We have certain columns or rows that are meaningless to aggregate. For example if we display offers given by multiple companies for the same item. The offers of different companies meaningful only on their own. The summary of those is misleading, so we do not want to show that in any arrangement of the pivot table. Furthermore we have certain aggregations that we may want to configure if possible. If one read-only column contains the quantity and the next editable column contains the price, we would like to show a third columns that is the total = quantity * price. It would be ideal if the pivot could calculate that for us when the user edits a cell in the price column. I understand this is more of a flat table functionality but we may need to use it in more complex scenarios when we need to show a pivot table.

6. There are scenarios when the user should be able to select certain root columns or nested columns in the pivot table. We may have to support cell selection as well. When the selection happens it should trigger a roundtrip to the server side.

What I would like to ensure is that we will be able to do these using standard features of the product. It is not a problem for us if we need to develop custom components or replace some parts of the table with our component. However we need to be forward compatible with your product, so whenever a new version is available we should be able to upgrade without breaking our customizations.

Thank you for your suggestions.

Regards,

Daniel

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster November 25, 2024

Hello, Deniel!

Thank you for getting back to us.

Let's discuss each described use case separately:

1) "We have certain columns or rows that are meaningless to aggregate."

Flexmonster supports different types of aggregations. It is possible to limit the available aggregations for each field separately, so, e.g., the Offers won't be summed up. The alternative approach can be to set the datatype of this field to string, then the list of aggregations would be limited by default.

You are welcome to read more about aggregations in Flexmonster by the link: https://www.flexmonster.com/doc/aggregation-functions/.

2) Editing on pivot grid

In our design, each cell of the pivot grid contains the aggregated value of n rows of data underneath. So, when editing the aggregated value in the cell, there should be a certain logic as to which row of raw data should be changed.

We delegate the editing logic part to our clients, as the use cases may differ, and allow changing the value in the pivot cell by editing in the drill-through view.
Here is the JSFIddle example to illustrate the idea: https://jsfiddle.net/flexmonster/k4cwdp63/. Please double-click on the necessary cell and then edit the value in the "Details" pop-up.

3) "A third column that is the total = quantity * price"

For such cases, we offer a calculated values feature: https://www.flexmonster.com/doc/calculated-values/.
This feature allows adding new measures with further calculations on the client side. For example, for your use case: https://jsfiddle.net/flexmonster/k4cwdp63/. Please note that the calculated values in Flexmonster work with aggregations, so the formula would look as follows:

formula: sum("Quantity") * sum("Price")

4) "There are scenarios when the user should be able to select certain root columns or nested columns in the pivot table. We may have to support cell selection as well. When the selection happens it should trigger a roundtrip to the server side."

Flexmonster provides the cellclick and celldoubleclick events that can be helpful for this use case.

Here is the full list of Flexmonster events and the JSFiddle example with cellclick to illustrate the idea.

 

5) We also wanted to ask about the data source you are planning to use. This information would be helpful in providing the most suitable solutions for you.
If you haven't decided yet, we suggest reading the following article as an entry point: https://www.flexmonster.com/blog/how-to-choose-the-best-data-source-to-use-with-flexmonster/.

 

Regarding your request, "we need to be forward compatible with your product, so whenever a new version is available, we should be able to upgrade without breaking our customizations," please note that all our minor releases are fully compatible and safe to update. As for the major releases, we always prepare the migration guide, which you can use to check if the update requires some minor changes.

 

Hope you will find our answer helpful.
Looking forward to your response.

Kind regards,
Solomiia

 

Please login or Register to Submit Answer