CODEWITHSUNDEEP
javascriptjqueryangularjsdatatableag-grid
Ruwantha R.
Ruwantha R.

Reputation: 82

does the ag-grid api support column filtering drop-down

in datatables it supports Individual column searching (select inputs). (datatable). Does ag-grid support similar functionality apart from filter column by typing.

enter image description here

Upvotes: 1

Views: 7426

Answers (3)

Jayamal Kulathunge
Jayamal Kulathunge

Reputation: 249

    import { Component } from '@angular/core';
import { AgFloatingFilterComponent } from 'ag-grid-angular';
import { IFloatingFilterParams } from 'ag-grid-community';

@Component({
  selector: 'number-component',
  template: `<select
      style="width: 100%"
      [(ngModel)]="currentValue"
      (ngModelChange)="onChange()"
    >
    <option value=""></option>
    <option *ngFor="let c of options" [ngValue]="c">{{c}}</option>
    </select>`,
})
export class OptionFilterComponent
  implements AgFloatingFilterComponent {
  params: IFloatingFilterParams | undefined;
  currentValue: Number | null | string = null;
  style: any;
  options: any;

  agInit(params: any): void {
    this.params = params;
    this.options = params.options;
  }

  onParentModelChanged(parentModel: any) {
    // When the filter is empty we will receive a null value here
    if (!parentModel) {
      this.currentValue = null;
    } else {
      this.currentValue = parentModel.filter;
    }
  }

  onChange() {
    if (!!!this.currentValue) {
      // Remove the filter
      this.params?.parentFilterInstance((instance: any) => {
        instance.onFloatingFilterChanged(null, null);
      });
      return;
    }
    this.params?.parentFilterInstance((instance: any) => {
      instance.onFloatingFilterChanged('equals', this.currentValue);
    });
  }
}

Upvotes: 0

Enthu
Enthu

Reputation: 532

Yes ag grid has an api gridOptions.api.setQuickFilter but it will be applied across the grid

Upvotes: 1

omalyutin
omalyutin

Reputation: 454

As far as I know, ag-grid does not support it "out-of-the-box". In free version only filtering of type "number" and "text" is supported. In paid, enterprise version, there is also a filter for type "set", but there is only multiple selection. However, there is a possibility to write a custom filter. The examples are shown under the "Custom Column Filtering" subchapter Link to the custom ag-grid filters

p.s. Wanted to leave a comment, because actually this is not really an answer, but does not have enough repo.

Upvotes: 2

Related Questions