CODEWITHSUNDEEP
angularjsangular-ui-grid
Skary
Skary

Reputation: 417

AngularJS ui-grid 3.x filter by inputbox

im using the ui-grid and have a input Box. I want to bind the input box as a filter to the column in the grid. I dont want to use the buildin textbox in the ui-grid.

can anyone help ?

Upvotes: 0

Views: 1937

Answers (2)

Constantin Guay
Constantin Guay

Reputation: 1664

As I was looking for the same kind of things, sunz7 answer helped me, but then, you can improve it, as in this state, the plunker provided by sunz7 do not allow to change the search. A new click on the button will trigger a search within the previous search.

And as bonus, an empty search field will remove the filter, just by changing

$scope.state.columns[1].filters.push({term: $scope.genderFilter});

by

$scope.state.columns[1].filters[0] = {term: $scope.genderFilter || '*'};

http://plnkr.co/edit/HN9kc9IbHdi9YH4OBUS7?p=preview

This fork of the plunker fix that.

Upvotes: 0

sunz7
sunz7

Reputation: 76

  1. in gridOption.columnDefs, set the column you want to filter, for example: { field: 'gender', enableFiltering: false } to disable inline filter
  2. get the grid state using gridApi
  3. find your column in state.columns and add your filter to it.
  4. restore grid state which is to apply your filter to the grid I made you a plunker. http://plnkr.co/edit/p878r7GsFig1goX5rroK?p=preview

Upvotes: 2

Related Questions