Posted 28 July 2021, 1:39 pm EST
Hi Team,
I using Wijmo grid which contains wijmo filter. To save and restore filterdefinition when filter is applied / changed I’m trying to fire filterChanged event.
Note: Grid data is loaded not on Oninit but after performing some action
below is the code related filters
Html
<wj-flex-grid #flexGrid class="bento-flex-grid has-row-hover" [class.list-grid]="isListGrid"
[itemsSource]="data" [stickyHeaders]="true" [showMarquee]="true" [showSort]="true"
(initialized)="initGrid(flexGrid)" [headersVisibility]="'Column'" [allowSorting]="'MultiColumn'"
(selectionChanged)="onSelectionChanged()">
<wj-flex-grid-filter #gridFilter [showSortButtons]="false"
(filterChanged)="onFilterChanged(gridFilter, $event)">
</wj-flex-grid-filter>
.ts
@ViewChild('gridFilter', { static: true }) gridFilter: wjcGridFilter.FlexGridFilter;
@ViewChild('flexGrid', { static: true }) flexGrid: wjcGrid.FlexGrid;
[b]//mostly used for clearing and refreshing filter or when grid is refreshed in my code [/b]
this.gridFilter.clear();
this.gridFilter.grid.refresh();
HideActionFilter() {
const col = this.gridFilter.grid.columns.getColumn('actions');
const cf: any = col ? this.gridFilter.getColumnFilter(col, true) : {};
// switch filterType to 0 if filters hidden, otherwise to filterType defined in model
cf.filterType = 0;
}
[b]//this method is called on init and to show/hide Filters[/b]
toggleFilter() {
this.toolbarConfig.filtersHidden = !this.toolbarConfig.filtersHidden;
if (this.gridFilter) {
// if filters are hidden, clear the grid filter
if (this.toolbarConfig.filtersHidden) {
this.gridFilter.clear();
}
// iterate through columns to filtered
for (let i = 0, il = this.gridColumns.length; i < il; i++) {
// get column and column filter
const col = this.gridFilter.grid.columns.getColumn(
this.gridColumns[i].binding
);
const cf: any = col ? this.gridFilter.getColumnFilter(col, true) : {};
// switch filterType to 0 if filters hidden, otherwise to filterType defined in model
cf.filterType = this.toolbarConfig.filtersHidden ? 0 : 3;
}
this.HideActionFilter();
this.gridFilter.grid.refresh();
}
}
[b]
//recently added onfilterChanged code[/b]
onFilterChanged(filter, args) {
if (filter.cancel) {
return; //filter not applied
}
this.filterDefination = filter.filterDefinition;
this.onSaveStateClick();
}
onSaveStateClick() {
var state = {
filterDefinition: this.filterDefination
}
localStorage['myworkgridState'] = JSON.stringify(state);
}
onRestoreClick() {
var json = localStorage['myworkgridState'];
if (json) {
var state = JSON.parse(json);
// restore filter definitions
this.gridFilter.filterDefinition = state.filterDefinition;
}
}
Can you please provide a resolve.
Regards,
Sneha
