show sub totals issue

hi

I encountered the following issues while using it.

Show sub totals and do not show sub totals functions, which can control the display of sub totals,

But when I chose show sub totals rows only and show sub totals columns only, they were not clearly displayed on the page.

Image_2251_1740369758169


If I need to hide show sub totals row only and show sub totals columns only, I need to control it.

I just want to display show sub totals and do not show sub totals


Thanks




9 Replies

SK Sridhar Karunakaran Syncfusion Team February 24, 2025 02:12 PM UTC

Hi Renard,


Thank you for sharing the image.


We understand that you are experiencing an issue where sub-total rows and columns do not appear or hide in the Pivot Table when selecting the respective options in the toolbar menu. After examining your image, we noticed that the column field members in your Pivot Table are collapsed. Please note that sub-totals in rows and columns will only appear once the row and column field members are expanded. Sub-totals display the summarized values for their respective child members.


If all parent members are collapsed, the aggregated values for those child members will remain hidden in the Pivot Table UI. In this case, the collapsed rows and columns (parent members) will not act as sub-totals; instead, they will display their aggregated data associated with the row, column, and value axes. This behavior aligns with how Microsoft Excel functions in a compact layout.


Therefore, to control the visibility of row and column sub-totals, ensure that the respective parent field members are expanded in the Pivot Table UI. Please refer to the GIF image below for further clarification.


Output GIF:


Furthermore, if you want to hide the "Show Subtotal Rows Only" and "Show Subtotal Columns Only" options from the subtotal menu in the toolbar, you can directly target the IDs of these items by following the naming convention:  Component ID + "subtotalcolumn" (for example, "PivotViewsubtotalcolumn") and set the CSS display property to none. Please see the code example provided below.


Code example:

<style>

  #PivotViewsubtotalcolumn{

    displaynone !important;

  }

  #PivotViewsubtotalrow{

    displaynone !important;

  }

</style>

 


Output screenshot:


Meanwhile, we have prepared a sample for your reference. You can find the sample at the following link:
Sample: https://stackblitz.com/edit/angular-ktdk48ey-kjxx4zs8?file=src%2Fapp.component.ts,src%2Fapp.component.html


Additionally, for detailed information on the sub-totals feature in the pivot table, please refer to the following user guide documentation and demo sample, which will guide you on the functionality of the sub-totals feature.

Documentation: https://ej2.syncfusion.com/angular/documentation/pivotview/summary-customization

Demo: https://ej2.syncfusion.com/angular/demos/#/tailwind3/pivot-table/summary-customization


Please let us know if you have any concerns.


Regards, 

Sridhar Karunakaran.



RE Renard February 25, 2025 02:52 AM UTC

Hi  Sridhar Karunakaran. 

          I clicked on the subtotal toolbar and chart toolbar. Can events trigger them so that I can distinguish the type of click. And perform some other operations.


  



RE Renard February 25, 2025 03:55 AM UTC

Hi  Sridhar Karunakaran. 

In the chart type settings, I set the language for Close, but it didn't work. The language for other content took effect.

Image_3905_1740455679057 Image_5253_1740453937487



SK Sridhar Karunakaran Syncfusion Team February 25, 2025 03:53 PM UTC

Hi Renard,


Please see the response below.


Query

Comments

I clicked on the subtotal toolbar and chart toolbar. Can events trigger them so that I can distinguish the type of click. And perform some other operations.

We understand that you need an event that triggers when the sub-total and chart menu items are clicked in the toolbar. If this is the case, you can use the actionBegin event, which is triggered when these menu items are selected. Please refer to the code example below.

 

Code example:

[app.component.html]

<ejs-pivotview #pivotview id='PivotView' [dataSourceSettings]=dataSourceSettings allowExcelExport='true'

            allowConditionalFormatting='true' allowNumberFormatting='true' allowPdfExport='true' showToolbar='true' allowCalculatedField='true'

            showFieldList='true' width='100%' [chartSettings]='chartSettings' [displayOption]='displayOption'

            height='450' [gridSettings]='gridSettings' [toolbar]='toolbarOptions'  (actionBegin)='actionBegin($event)' locale='zh'>

[app.component.ts]

    actionBegin(args: PivotActionBeginEventArgs): void {

        if (args.actionName == 'Show chart view' || args.actionName == 'Show sub-totals') {

            console.log(args.actionName)

        }

    }

 

Output screenshot:

Meanwhile, we have prepared a sample for your reference, which is available at the following link. 

Sample: https://stackblitz.com/edit/angular-afudwbhw-kcsapbkb?file=src%2Fapp.component.ts,src%2Fapp.component.html

In the chart type settings, I set the language for Close, but it didn't work. The language for other content took effect.

Thank you for providing the image. We understand that you are experiencing an issue where the localized text is not correctly displayed in the title attribute of the Close icon in the Chart Type Settings dialog.

 

We would like to inform you that the Syncfusion EJ2 Dialog component is used to display this dialog. However, upon reviewing your image, we noticed that localization was applied to the Pivot Table component’s Close text instead of the Dialog component’s Close text. This mismatch is causing the issue. To resolve this, please ensure that localization is applied to the Close text of the Dialog component.

 

Refer to the code example below for implementation details.

 

Code example:

        L10n.load({

            ['zh']: {

              'dialog': {

                "close": "",

             }

            },

        });

 

Output screenshot:

Meanwhile, we have prepared a sample for your reference, which is available at the following link. 

Sample: https://stackblitz.com/edit/angular-afudwbhw-kcsapbkb?file=src%2Fapp.component.ts,src%2Fapp.component.html

 

Furthermore, you can refer to the user guide documentation provided for more information about localization in the dialog component: 

Document: https://ej2.syncfusion.com/angular/documentation/dialog/localization

Similarly, if you encounter the same issue with other UI elements in the Pivot Table, please ensure that localization is applied to the corresponding component. 

 

For more details on dependent components used in our Pivot Table, please refer to the following User Guide documentation:

Document: https://ej2.syncfusion.com/angular/documentation/pivotview/getting-started#dependencies


Please let us know if you have any concerns.


Regards, 

Sridhar Karunakaran



RE Renard February 27, 2025 08:45 AM UTC

Hi  Sridhar Karunakaran

   

I need to set the globalization of the operation keys that pop up the chart, but the settings in pivot field list and pivot view are invalid. And the corresponding Key cannot be found in the corresponding globalization document

Image_2509_1740645782520



AP AngelinFaithSheeba PaulvannanRajadurai Syncfusion Team February 28, 2025 02:59 PM UTC

Hi Renard,


Thank you for providing the image. We understand that your requirement is to provide localization for the Chart’s Zoom Settings icons. If so, we would like to inform you that the Syncfusion EJ2 Chart component is used to render our Pivot Chart. However, to apply localization to the Zoom Settings icons in the Pivot Chart, you need to provide localization for the Chart component’s Zoom Settings text. Refer to the code example below for implementation details.


Code example:

 L10n.load({

            ['zh']: {

             "chart": {

                "Zoom": "放大",

                "ZoomIn": "放大",

                "ZoomOut": "縮小",

                "Reset": "",

                "Pan": "",

                "ResetZoom": "重設縮放"

              },          

            },

        });

Output GIF:


Meanwhile, we have prepared a sample for your reference, which is available at the following link. 

Sample: https://stackblitz.com/edit/angular-afudwbhw-4xzvpeu1?file=src%2Fapp.component.ts,src%2Fapp.component.html


Please let us know if you have any concerns.


Regards,

Narmatha Saminathan.



RE Renard March 3, 2025 07:20 AM UTC

Hi  Narmatha Saminathan.

Thank you very much for your answer.

However, I am currently facing a new problem and need your help.

When I switch to Show SubTotal, there is no problem (Figure 1), but when I change FiedList and add Rows, and then switch to Show SubTotal, the effect will not work (Figure 2). I need to click twice for it to take effect or refresh the data.

May I ask if I need to refresh the Pivot View at this point or if there are other solutions available.

If I need to refresh the Pivot View, is there an event that can trigger the implementation? After modifying Rows or delaying layout updates.

Image_8009_17409863053661Image_9871_17409863519152

Thanks



AP AngelinFaithSheeba PaulvannanRajadurai Syncfusion Team March 4, 2025 02:38 PM UTC

Hi Renard,


We have checked the reported issue and were able to replicate it on our end. Therefore, we have classified it as a bug titled "Subtotals Not Updating After Modifying Static Field List". The fix for this issue will be included in the first weekly release after the Vol 1, 2025 main release, which is scheduled to be rolled out at the end of March 2025. You can track the status of the issue using the feedback link below.


Feedback: Subtotals Not Updating After Modifying Static Field List in Angular | Feedback Portal


Disclaimer: “Inclusion of this solution in the weekly release may change due to other factors including but not limited to QA checks and works reprioritization.

Until then, we recommend you to use this work-around solution by resetting the isStaticRefresh property to false within the dataBound event to resolve the reported issue at your end. Please refer to the code example below.

Code example:

app.component.html:

 

<ejs-pivotview  (dataBound)="dataBound()"> </ejs-pivotview>

 

app.component.ts:

 dataBound(): void {

        if (this.pivotObj.isStaticRefresh) {

            // Reset the static refresh flag to prevent unnecessary reloading

            this.pivotObj.isStaticRefresh = false;

        }

    }


Output GIF:


Meanwhile, we have prepared a sample for your reference. Please find it from below link.

Sample: https://stackblitz.com/edit/angular-zt2lqf9m-97fyrxxh?file=src%2Fapp.component.ts,src%2Fapp.component.html


We appreciate your patience until then.


Regards,
Narmatha Saminathan.



KG Kalaivannan Ganesan Syncfusion Team March 26, 2025 01:21 PM UTC

Hi Renard,


Thank you for your patience. We are glad to announce that our Essential Studio® 2025 Volume 1 Main Release (V29.1.33) has been rolled out. This release includes the fix for the issue "Subtotals Not Updating After Modifying Static Field List," as promised. Thus, we recommend you to update your package to the latest version to resolve the reported issue at your end.


Additionally, we have prepared a sample using the latest version for your reference. You can find the sample attachment below.


Output GIF:

 


Issue root cause: 

The issue occurred because Pivot Table refreshing was restricted after performing actions in the Static Field List, preventing subtotal updates from being applied. This has now been fixed by ensuring that the Pivot Table updates properly whenever any actions are performed in the Static Field List.


Please refer to the release notes below for your reference. 

Release notes: https://ej2.syncfusion.com/angular/documentation/release-notes/29.1.33?type=all#pivot-table


We thank you for your support and appreciate your patience as you waited for this release. Please get in touch with us if you require any further assistance.


Regards, 

Narmatha Saminathan.


Attachment: .angular_9ab20602.zip

Loader.
Up arrow icon