Pivot table customize context menu

Answered
vinoth asked on June 13, 2024

In pivot table, I want to show expand all rows option when the user right click on any row. If the rows already opened means  i need to show collapse all option.

If the user right clicks on any column header, i should have context menu as expand all columns, if the columns are already opened ,means it should show collapse all option.

Is there any provision to achieve this?

I have seen customizeContextMenu method to add any custom menu. but i want to show expand all rows only when the user right click on any row, likewise when the right click on any column i should show expand all columns.

5 answers

Public
Maksym Diachenko Maksym Diachenko Flexmonster June 14, 2024

Hello, Vinoth!

Thank you for reaching out to us.

We have taken into account the details provided in your new ticket. Nevertheless, to address your inquiry better, we would like to ask you the following questions:

  1. Which data source type are you currently using? 
  2. Could you please confirm whether you ask if the "Expand All/Collapse All" context menu handlers should be made available for all member cells? Referring to this JSFiddle, this includes blue, green, and others for rows, as well as Accessories, Bikes, and others for columns.

We are looking forward to hearing from you.

Best Regards,
Maksym

Public
vinoth June 14, 2024

Hi,

  1. DataSourceType- JSON
  2. yes It should available only for type- header

Show Expand all option only (when the rows or columns) are collapsed already.
Show Collapse all option only (when the rows or columns) are expanded already.

There is method called "expandAllData" which accepts (rows or columns )  as arguments. But how do I ensure whether user has right clicked on rows or columns.  is there any property to check whether the user has right clicked on rows or column.

There is no provision for collapse all rows or columns.  "collapseAllData" simply collapses all data.

 

im getting callback whenever i right click on row/columns

flexOptions.customizeContextMenu = (items: ContextMenuItem[], data: CellData,viewType: string)=>{

 

    here i need to check whether it rows or columns , based on that i need to show collapse or expand all options.
    As of now expandalldata option is there to expand rows or column, but collapseAll cannot be used to specific operation either row or column

}

Public
Maksym Diachenko Maksym Diachenko Flexmonster June 17, 2024

Hello, Vinoth!

Thank you for sharing these details with us.

The described functionality for expanding and collapsing rows and columns can be added within Flexmonster. You are welcome to check the JSFiddle example: https://jsfiddle.net/flexmonster/h6ybemfx/

To find out whether the cell is a column or row member, you can use the rows and columns properties of the cell object. When the row member is clicked, the length of rows is greater than zero, while the columns array is empty. For columns, the same logic is applied the other way around:

data.rows.length > 0 && data.columns.length === 0

As you have mentioned, the expands can be handled with the expandAllData with the type parameter. For collapsing all rows or columns, you can retrieve their unique names and use the collapseData method to collapse all hierarchies individually.

Please let us know if the suggested solution works for you.

Best Regards,
Maksym

Public
vinoth June 19, 2024

Its working, thanks a lot.

Public
Maksym Diachenko Maksym Diachenko Flexmonster June 20, 2024

Hello, Vinoth!

Thank you for your feedback.
We are glad to hear that the suggested approach works for you.
Feel free to contact us if more questions arise.

Best Regards,
Maksym

Please login or Register to Submit Answer