Thomas
Thomas

Reputation: 1649

Dynamic header name refresh with Ag-Grid

I have a "select" column and I want to have the total of the current selected rows in the header name.

I am using headerValueGetter but the value is not refreshed when a new row is selected.

// in my colDef
headerValueGetter: params => `(${this.totalSelected})`

// methods
onSelectionChanged(event) {
  this.totalSelected = event.api.getSelectedNodes().length
},

totalSelected is a property of my Vue component and its value is updated when a new row is selected.

Any ideas how to accomplish this ?

enter image description here

Upvotes: 5

Views: 10890

Answers (1)

Alexander Zbinden
Alexander Zbinden

Reputation: 2566

Try refreshing the header manually in your selectionChanged-event:

onSelectionChanged(event) {
  this.totalSelected = event.api.getSelectedNodes().length;
  gridOption.api.refreshHeader();
},

Upvotes: 7

Related Questions