CODEWITHSUNDEEP
angularjsuser-interfaceangular-ui-grid
uideveloperui
uideveloperui

Reputation: 19

server side filtering with UI grid

There is a default filtering provided by ui grid whcih is enabled using enableFiltering: false in gridOptions. Instead of using this default filtering i was the use the text entered in the filter box for multiple columns, send the filters to the serevr and get the data back. I have tried using filterOptions but $scope.$watch('filterOptions', function (newVal, oldVal) {

        if (newVal !== oldVal) {
            $scope.getPagedDataAsync($scope.gridOptions.$gridScope.filterText);
        }
    }, true);

never gets invoked. any help is appreciated.

Upvotes: 0

Views: 890

Answers (1)

Scott
Scott

Reputation: 1690

There are a couple of different ways you can do this. In the onRegisterApi in the grid options you can do this:

  onRegisterApi: function(gridApi) {

         gridApi.core.on.filterChanged($scope,
              function(rowEntity, colDef, newValue, oldValue) {
             // check which filter value changed and do something
             // to get the value from a filter in column X you can do 
                  gridApi.grid.columns[X].filters[0]
              }
         );
  }

You may also set a filter object on each cell. Perhaps collect the various columns you wish to filter on and put a filter object on each of those cells. Whenever one changes you would have all the values you need and you can create a function in the "condition" that is called to do the fltering.

   filter: { type: xxx, condition: $scope.myCustomFilter }

   $scope.myCustomFilter = function(searchTerm, callValue) {

       // check your various conditions here and return true/false
   }

Upvotes: 0

Related Questions