SharePoint JSOM list pagination (paging)

If you work with a list that contains a lot of items, then you need to access the list items in chunks (UI experts/developers called it paging or pagination).SharePoint list pagination requires two parameters, the size of the items page and the requested page info. This code ha

C# (1.1 MB)
4.6 Star
5,172 times
Add to favorites
E-mail Twitter Digg Facebook
Sign in to ask a question

  • Pulling same items. Any ideas?
    2 Posts | Last post June 30, 2019
    • First off, thanks for this info! Great stuff.
      I've added this code for a simple "Show More" button. I don't necessarily need a "back" button. Just an acting "Next" button that will continuously add more items to the page.
      My problem is that whenever I click my "Show More" button, it just keeps pulling the same first 15 cards over and over. I made sure my index starts at 1, but scratching my head over this. Would it have anything to do with where this code is placed in my Content Editor file?
    • Figured it out - I forgot to add camlQUery.set_listItemCollectionPosition(position); after declaring var camlQuery = new SP.camlQuery();
      It never had a starting position set to begin with. Case closed!
  • Issue when paging sort by datetime column
    4 Posts | Last post August 24, 2018
      when execute the below  
       previousPagingInfo = "PagedPrev=TRUE&Paged=TRUE&p_ID=" + spItems.itemAt(0).get_item('ID') + "&p_" + sortColumn + "=" + encodeURIComponent(spItems.itemAt(0).get_item(sortColumn)); 
      spItems.itemAt(0).get_item(sortColumn) value:  Thu Jan 9 00:00:00 UTC+0800 2014
      then click "back" button  will generate the error.  
    • Muawiyah Shannak
      Greatly expect your feedbacks!
    • Hi Jees,
      you should use the ISO format for the date field, try this: spItems.itemAt(0).get_item(sortColumn).toISOString();
      and please share the error message with us.
    • Thanks GOD!This problem has bother me almost two weeks!! 
      Finally I solve this problem, it's all about the "DateTime formate",before I use the ".toISOString()" ,the prev paging function was always wrong, it skip items is uncorrect.
  • Thanks )
    1 Posts | Last post August 16, 2017
  • Paging with Search
    1 Posts | Last post June 09, 2016
    • My Paging works perfectly fine,but the problem is that I have a search textbox when i enter a text and click on search then do paging it doesnt work
  • For anyone still struggling with the pagination error when sorting by a date field...
    1 Posts | Last post January 04, 2016
    • I replace the following line
      previousPagingInfo = "PagedPrev=TRUE&Paged=TRUE&p_ID=" + spItems.itemAt(0).get_item('ID') + "&p_" + sortColumn + "=" +  encodeURIComponent(spItems.itemAt(0).get_item(sortColumn)); 
      with this:
      var prev= encodeURIComponent($.formatDateTime('yymmdd', new Date(spItems.itemAt(0).get_item(sortColumn))));    
      previousPagingInfo = "PagedPrev=TRUE&Paged=TRUE&p_ID=" + spItems.itemAt(0).get_item('ID') + "&p_" + sortColumn + "=" + prev;
      And added a reference to the jquery.formatDateTime plugin by Adam Gschwender that can be found here:
      Works like a charm now!
  • So this pagenation still works with have a where condition in caml query?
    1 Posts | Last post July 22, 2015
    • Hi Muawiyah Shannak,
      So  this pagenation still works with have a where condition in caml query?
  • Issue while creating paging with spServices
    2 Posts | Last post September 19, 2014
    • Hi Muawiyah Shannak,
      How to do the same paging using Sp Services ?
    • I didn't try i'll check if it is possible
  • I got an error
    1 Posts | Last post June 11, 2014
    • Hi
      context.load(spItems, 'Include(Title)');
      When i add include like above.
      if (spItems.get_listItemCollectionPosition()) {
              nextPagingInfo = spItems.get_listItemCollectionPosition().get_pagingInfo();
          } else {
              nextPagingInfo = null;
      The property or field 'ListItemCollectionPosition' has not been initialized.
  • Error for Back button sorting by Datetime column
    2 Posts | Last post December 19, 2013
    • Hi Muawiyah,
      Thanks for your great paging, sorting sample code. It works really well. I had one strange error when clicking the back button and sorting by a datetime column:
      "Request failed. Exception from HRESULT:0x80131904 undefined". The error happens in the line context.executeQueryAsync(...); after context.load(spItems); 
      The Next button is fine for DateTime column.
    • Hi Robert, Can you share your code here, please?