AngularJS UI-grid filter OR option

Question

We are using ui-grid in one of our project and currently we can apply two filters on each column which is supported by UI-grid. We have filters arrays something like mentioned below:

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

This will return rows which are matches both the criteria. This is perfect.

Now we would like to add "OR" condition in between these filters so that both filters can be applied or one of them can be applied. I don't see any support in UI-grid for this feature. Any idea how to achieve this functionality?

Any help would be much appreciated.

Brian Brian · Accepted Answer · 2016-05-24T22:37:32

The scope within the grid is not the same as your controller's scope. Therefore, you must use grid.appScope:

var cellSelectTemplate = '<select ng-change="change(status, row.entity)" ng-model="status" ><option ng-repeat="stat in grid.appScope.dataStatuses" value="{{stat.id}}">{{stat.status}}</option></select>';

More information:

reference to the application scope (the parent scope of the ui-grid element). Assigned in ui-grid controller use gridOptions.appScopeProvider to override the default assignment of $scope.$parent with any reference

From (http://ui-grid.info/docs/#/api/ui.grid.class:Grid)

AngularJS UI-grid filter OR option

1 Answers