Filter for wijmo flex grid

Filter for wijmo flex grid

Posted by: mail2ravindar on 22 March 2018, 7:55 am EST

• 

  mail2ravindar

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 22 March 2018, 7:55 am EST

  Hi ,

  I tried below example for for filter in my flexgrid.
  
  http://demos.wijmo.com/5/Angular/WijmoHelp/WijmoHelp/topic/wijmo-wijmo.angular2.grid.filter.Module.html

  But I am getting Error :
  
  ‘wj-flex-grid-filter’ is not a known element:

  1. If ‘wj-flex-grid-filter’ is an Angular component, then verify that it is part of this module.2… If ‘wj-flex-grid-filter’ is a Web Component then add ‘CUSTOM_ELEMENTS_SCHEMA’ to the ‘@NgModule.schemas’ of this component to suppress this message.

  Could you please help on it. I am using Angular5

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 23 March 2018, 6:32 am EST

  Hi,
  
  Please verify that the grid filter is correctly imported in you angular module.
  
  Refer to following code snippet:-

  
  import { WjGridModule } from "wijmo/wijmo.angular2.grid";
  
  import { WjGridFilterModule } from "wijmo/wijmo.angular2.grid.filter";
  
  
  @NgModule({
  
  imports:[WjGridModule, WjGridFilterModule],
  
  .....other options
  
  })
  
  export class AppModule{
  
  
  }
  

  Here is a sample of grid filter module if you need any reference

  http://demos.wijmo.com/5/SampleExplorer/SampleExplorer/Sample/FlexGridFilter

• 

  mail2ravindar

  • Post Options:
  • Link
    Copy

  Posted 26 March 2018, 2:42 am EST

  Thanks Abhishek, Now it is working fine.
  
  But how can I clear all the filters .

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 27 March 2018, 5:56 am EST

  Hi,

  You can use clear() method provided by FlexGridFilter.

  //refer to following code snippet
  
  <wj-flex-grid>
  
  <wj-flex-grid-filter #filter></wj-flex-grid-filter>
  
  </wj-flex-grid>
  
  <button (click)="filter.clear()">Clear filter</button>
  
  

  Please refer to the following document to get a list of all the available properties,methods and events:-

  http://demos.wijmo.com/5/Angular/WijmoHelp/WijmoHelp/topic/wijmo-wijmo.angular2.grid.filter.WjFlexGridFilter.Class.html

• 

  mail2ravindar

  • Post Options:
  • Link
    Copy

  Posted 29 March 2018, 8:16 am EST

  Thanks Abhishek. The above clear functionality is working.<button (click)=“filter.clear()”>Clear filter.

  I just want to enable this button only on applying filter on any column. could you please help on implementing it.

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 29 March 2018, 8:32 am EST

  There are filter events which you may use for this. You can clear the filter inside those events based on your use case .

  http://demos.wijmo.com/5/Angular/WijmoHelp/WijmoHelp/topic/wijmo.grid.filter.FlexGridFilter.Class.html#filterApplied

  filter.filterChanged[b][/b].addHandler(function (s, e) {
    var cf = filter.getColumnFilter(e.col);
    if (!cf.valueFilter.isActive && cf.conditionFilter.condition1.operator == null) {
      cf.filterType = wijmo.grid.filter.FilterType.Condition;
      cf.conditionFilter.condition1.operator = wijmo.grid.filter.Operator.CT;
    }
  });