Pagination in service portal

[malu]

I have a pagination to setup for a widget. My widget displays information from a custom table. Customer like to have a pagination to setup for the list of records produced in the widgets BUT unable to run a filter on the client script.

my code below

HTML

<tr ng-repeat="item in c.data.usersList | startFrom: currentPage*pageSize | limitTo: pageSize">

<button ng-disabled="currentPage == 0" ng-click="currentPage=currentPage-1">

              Previous

  </button>

      {{currentPage+1}}/{{numberOfPages()}}

<button ng-disabled="currentPage >= c.data.usersList.length/pageSize - 1" ng-click="currentPage=currentPage+1">

              Next

  </button>

Client script:

function($scope){

$scope.currentPage = 0;

  $scope.pageSize = 12;

      $scope.numberOfPages=function(){

              return Math.ceil($scope.c.data.usersList.length/$scope.pageSize);                              

      }

$scope.filter('startFrom', function() {

      return function(input, start) {

              start = +start; //parse to int

              return input.slice(start);

}

      });

}

I can get the Previous button and Nextbutton with the total number of pages but unable to see the data for it.

$scope.filter is responsible to produce the output BUT somehow is the failing.

Pls help

[larstange]

Hmm - I haven't experienced something link that.

I'm thinking that it might be the data from the server side script which is not being generated?

Try adding a <pre>{{data}}</pre> in the top or bottom of the widget to debug

[Ximizu]

Thanks for your feedback. I have added <pre>{{data|json}}</pre> and confirm that the data are here. It's driving me craaaaazy. I have spend too much time on this already, I'm afraid I will go back with the OOTB widget "Data table from instance definition" 😕

ps: there is a slight improvement: Since I have change the type of the angular provider from "Directive" to "Factory", the widget is corretly display when the page loads the first time, but the html element having the directive dir-paginate is not displayed directly. It ways to navigate to another page and back to be displayed...

[larstange]

Hi

One thing - can you try and remove all of your static binders (::) - i believe this could cause you issues as they are only evaluated once. Im especially suspect of :

::data.records

[Ximizu]

Thanks, I tried this yesterday, but is not the root cause neither

[Ximizu]

hi larstange, my problem is finally resolved!

What is funny, is that I found the solution in another comments you made

https://community.servicenow.com/community?id=community_question&sys_id=0b4e8beddb9cdbc01dcaf3231f96...

So, the reason it didn't work, is that because I though that I had to use the dirPagination.js code as an angular provider as described in this documentation

https://docs.servicenow.com/bundle/kingston-servicenow-platform/page/build/service-portal/task/angul...

Thanks again