Replied 28 July 2022, 6:38 pm EST
The observed behavior is by design. The detail dialog of the PivotGrid display's the field name instead of the header as the Detail grid in the detail dialog is a Flexgrid instance and it generates columns automatically based on the data source for Pivot Grid. Similarly, the field setting's dialog display's the field name based on the data source.
The reason for the above behavior is that if we show headers instead of binding, it brings ambiguity as the same binding can be used in PivotGrid with different headers in the DetailDialog grid.
For example, in https://www.grapecity.com/wijmo/demos/OLAP/PivotGrid/DetailDialog/purejs
'sales' binding is used with two different headers 'Sales' and 'Diff'. The detailDialog and setting dialog shows row data which has only one column with 'sales' binding, so here It would be unclear which header should be used in this case.
Therefore, to implement the above requirement, you need to manually update the column header in the displayed grid in the detail dialog, and to update the field setting dialog header you may add a context menu event on PivotGrid and use the underlying instance of the listbox to update the setting dialog header. Please refer to the sample given below for the same:https://stackblitz.com/edit/js-bl25yn?file=index.js
Feel free to revert back if you have any further queries/ concerns.