Custom icon in header of the pivot grid

Custom icon in header of the pivot grid

Posted by: chinmay.patil on 14 February 2018, 8:23 pm EST

• 

  chinmay.patil

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 14 February 2018, 8:23 pm EST

  Hi Team,

  I’m trying to edit the column headers of the Wijmo Pivot Grid.
  
  My requirement is to insert custom icon in the headers of the Grid, i.e for the cellType= 2 and cellType =4. Is there any way to achieve this?

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 14 February 2018, 10:10 pm EST

  Please try the code given below.

  Html :-

  <wj-pivot-grid #ctmGrid
  
  [itemsSource]="ngFmt"
  
  (formatItem)="formatItem(ctmGrid, $event)"
  
  [showSelectedHeaders]="'All'"
  
  [itemFormatter]="formatterFunction" 
  
  style="border:none">
  
  </wj-pivot-grid>
  
  

  TS:-

  
  formatterFunction(panel,r,c,cell){
  
  if(panel.cellType==wjcGrid.CellType.ColumnHeader||panel.cellType==wjcGrid.CellType.TopLeft){
  
  if(r==0){
  
  //adding wijmo glyph as icon
  
  var icon=wjcCore.createElement("span");
  
  wjcCore.addClass(icon,"wj-glyph-diamond");
  
  cell.appendChild(icon);
  
  }
  
  }
  
  }