dataStateChange on kendo-grid-column-chooser

[Bob]

Hi Guys,

Why does the kendo-grid-column-chooser component not fire dataStateChange so any changes to selected columns can be persisted?

 

On my grid I have the following command:

(dataStateChange)="dataStateChange($event)"

And I have even tried:

<kendo-grid-column-chooser (dataStateChange)="dataStateChange($event)" class="pull-right"></kendo-grid-column-chooser>

But neither command fires dataStateChange from the column chooser.  Is there a solution to this?

Cheers,
Bob

[Yanmario]

Hi Bob,

Thank you for the provided code snippets.

In general, the DataStateChange event fire when the data state of the Grid is changed, and the event is only available to the Grid component as the ColumnChooserComponent doesn't have any events. When the ColumnChooserComponent is used, the columnVisabilityChange event will fire when the user changes the columns' visibility. The event also provides information about the hidden columns as demonstrated in the following StackBlitz example:

https://stackblitz.com/edit/angular-1rhvbe?file=app/app.component.ts

I hope this helps.

Regards,
Yanmario Menev
Progress Telerik

[Bob]

Hi Yanmario,

Perfect answer, I was able to use the columnVisibilityChange event to persist newly selected and deselected columns:

  columnChange(e: ColumnVisibilityChangeEvent) {
    e.columns.forEach((column) => {
      let columnConfig = _.find(this.gridSettings.columnsConfig, m => m.title === column.displayTitle); 
      columnConfig.hidden = column.hidden;
    })
    this.saveGridSettings(this.grid);
  }

Cheers,
Bob

 

 

[Yanmario]

Hi Bob,

I'm happy to hear that the provided information helped you achieve the application requirment and indeed, the provided code snippet solution looks good.

Regards,
Yanmario Menev
Progress Telerik