Search results

HeaderValueAccessor API in Vue Grid API component

This method is used to apply the custom header cell values from an external function and display them on each rendered header cell.

<div id='Grid'></div>
import { Grid, Column } from '@syncfusion/ej2-grids';
let gridObj: Grid = new Grid({
  dataSource: [
    { EmployeeID: 1, EmployeeName: ['John', 'M'] },
    { EmployeeID: 2, EmployeeName: ['Peter', 'A'] },
  ],
  columns: [
    { field: 'EmployeeID', headerText: 'Employee ID' },
    {
      field: 'EmployeeName',
      headerText: 'Employee First Name',
      headerValueAccessor: (field: string, column: Column) => {
        return 'customized header';
      },
    },
  ],
});
gridObj.appendTo('#Grid');
Paramter Name Type
field string
column ColumnModel