Manoj Kumar
Manoj Kumar

Reputation: 21

How to do multiple filtering in angular ui-grid?

I need to filter a column with multiple conditions. Here's my code:

filters : [ 
    {
        condition : uiGridConstants.filter.GREATER_THAN,
        placeholder : 'greater than'
    },{ 
        condition : uiGridConstants.filter.LESS_THAN,
        placeholder : 'less than'
    }
]

The above code will show "greater than" and "less than" the value of a particular column. I need to add 2 more conditions: something like "not between greater than and less than values".

Here's the plunker: http://plnkr.co/edit/co8tfDrn2EOyC5thrMwg?p=preview

Upvotes: 2

Views: 4220

Answers (2)

Chris Lonardo
Chris Lonardo

Reputation: 141

Are these conditions hardcoded, or are something you want the user to be able to edit? You can do this with custom filtering as shown in the UI-Grid docs: link

And by writing a custom filter function- link

Upvotes: 0

Kathir
Kathir

Reputation: 6196

The column filter can also take functions and the function signature is

function(term,value,row,column){
}

as long as this function returns a true your row will be visible. The column filter function in your case will be this

 $scope.colFilter.condition = function(term,value, row, column){
      return (value>$scope.greater && value<$scope.less)
    }

Look at this plnkr for the greater and lesser functionality.

http://plnkr.co/edit/4HCwBdkOWGOl07XmxPKi?p=preview

Upvotes: 2

Related Questions