Sorting doesn't work in Server Side Paging Example

[chandramuralis]

In the below example sorting and Search functionality doesn't work. Could you please provide some working example? http://josebalius.github.io/ngReactGrid/examples/serverSide.html

[josebalius]

@chandramuralis The reason why sorting, search and pagination don't work in that example is because they are not supposed to (in that example).

What that example shows is that getData will get called whenever there is a change in state on the grid.

It is up to you, to implement the sorting, paging and search algorithms on your backend. For example:

$scope.grid = {
   ...
   getData: function() {
     var grid = this;
     // sorting info (field and direction) - grid.sortInfo.field, grid.sortInfo.dir
     // search info - grid.search
     // pagination info - grid.currentPage
     mySpecialAPIService.getData(grid.sortInfo.field, grid.sortInfo.dir, grid.search, grid.currentPage).then(function(data) {
             $scope.grid.data = data;
     });
   }
   ...
}; 

mySpecialAPIService is a service you have to write that should make an HTTP call to a backend and pass in those grid state parameters, then your backend should use those parameters to filter the data. ie. pass it to your SQL query, etc.

The example simply shows that getData hook and how you can refresh the data after X amount latency.

[chandramuralis]

Thanks for the explanation, I see what do you mean now.

[gaganyadav]

Hi

I am begginer in angularjs and implementing the below example http://josebalius.github.io/ngReactGrid/examples/serverSide.html

and using the code as mention in above comment $scope.grid = { ... getData: function() { var grid = this; // sorting info (field and direction) - grid.sortInfo.field, grid.sortInfo.dir // search info - grid.search // pagination info - grid.currentPage mySpecialAPIService.getData(grid.sortInfo.field, grid.sortInfo.dir, grid.search, grid.currentPage).then(function(data) { $scope.grid.data = data; }); } ... };

I am getting problem during cancel after click on edit button it shows No record found. I am using the below code. $scope.cancel = function () { $scope.editingGrid = false; $scope.grid.cancel(); };

or i have to call my service on cancel button press also. Please provide the solution for this if possible and if localMode: false then column filter is not showing, Could you please provide the solution for this.

one more thing if any function available in this grid by which i can get edit only those rows which are checked and i want to get $scope.selections value for those rows because this time i am calling my service and again uploading the grid and assigning $scope.selections=[] in cancel function and then clicking on checkbox is showing blank.

$scope.cancel = function () { // calling my service to load grid from server $scope.selections=[]; $scope.editingGrid = false; $scope.grid.cancel(); };

Any kind of help is really appreciable.