Custom header text in Pivot Grid

[John]

How can I render text in this header cell of a PivotTable?  I suspect the HeaderCellInfo event could be used, but I can't figure out how to  use it properly.

Also, is there an easy way to change the header row's height to something shorter, e.g. 21px?

[AngelinFaithSheeba PaulvannanRajadurai]

Hi John,

Using headerCellInfo event , you can customize the first cell of the pivot table. Please see the example code below.

Code Example:

var pivotObj = new ej.pivotview.PivotView({

  gridSettings: {

    headerCellInfo: function (args) {

      debugger;

      if (args.cell.column.headerText === '') {

        args.node.querySelector('.e-headertext').innerText = 'Runner Sales Breakdown';

      }

    }

  }

});

Meanwhile, we have prepared a sample for your reference.

Sample:  https://stackblitz.com/edit/sspdwx-o4uafi?file=index.js

Please check the following document for more information about “headerCellInfo” event.

Document: https://ej2.syncfusion.com/javascript/documentation/pivotview/row-and-column/#headercellinfo

Please let us know if you have any concerns.

Regards,

Angelin Faith Sheeba.