CODEWITHSUNDEEP
javascriptangularjsgridangular-ui-grid
Varun
Varun

Reputation: 597

Can internal and external sorting/filtering be applied to ui-grid?

I have requirement where there is two ui-grids in one page as shown in the below screenshotenter image description here

In UI-Grid One: Batch Charges should have its own sorting/filtering i.e. through 

col.enableFiltering = true;
col.enableSorting = true; // (Typescript code)

In Grid two - for Samples and Test name column it should have its own filtering/sorting enabled.

But apart from this from List Price column to Net Interco column the filtering/Sorting should work based on the first grid. i.e.

If I sort the List Price then the corresponding column in the second grid should also get sorted. similarly, when I use the filter on NBS Price the corresponding column in the second grid should also get filtered based on the entered text in the filter text box in the first UI-Grid.

Let me know if this is possible ??.

I tried sortChanged method of the UI-Grid API registering it through onRegisterApi but it didn't work.

So my final Grid config for both these grids will look like

grid.enableFiltering = true;
grid.enableSorting = true;
grid.useExternalFiltering = true;
grid.useExternalSorting = true;

So my other question is will both enableFiltering and useExternalFiltering work for same UI-Grid.

Upvotes: 1

Views: 1273

Answers (1)

Scott
Scott

Reputation: 1690

For the filter change you can use the filterChanged event (I use it and it works fine). Put it in your onRegisterApi function:

onRegisterApi: function(gridApi) {

   gridApi.core.on.filterChanged($scope, function(....) {
     // Set some scope variable that both lists use for filtering
     $scope.someFilterValueBothListsLookAt = ......
   });

}

I have not tried sortChanged but I would guess it works in a similar manner.

Upvotes: 0

Related Questions