Forum Discussion

wkennis's avatar
wkennis
Guide
2 years ago

Problem creating pagination with rest2.0 query

I'm trying to create a list of blog items with pagination but this is not working. I don't know if it is because I am doing something wrong or not but i did use a code snippet i found here. The code snippets i found was with the old rest calls, so there could be an issue.

My code:

<#-- Gets page size from settings (You could hard code your value instead) or defaults to 10 -->
<#assign page_size = settings.name.get("blog.entries_per_page_num")?number!5 />

<#-- Gets page number from the URL and defaults to 1 -->
<#assign page_number = webuisupport.path.parameters.name.get("page", 1) /> 

<#-- gets all the recent messages-->
<#assign messages = rest("2.0","/search?q=" + "SELECT id,subject,body,view_href,cover_image,author.login,author.id,author.view_href,kudos.sum(weight),metrics.views,post_time, post_time_friendly,search_snippet FROM messages WHERE depth=0 AND conversation.style='blog' AND board.id ='${coreNode.id}' ORDER BY id LIMIT 5 OFFSET 5 "?url).data.items![] />

<#-- Gets the total number of results -->
<#assign result_list_size = rest("2.0","/search?q=" + "SELECT count(*) FROM messages WHERE depth=0 AND conversation.style='blog' AND board.id ='${coreNode.id}'"?url).data.count![] />

<#-- This contains the pagination configuration options -->
<#assign pageable_item = webuisupport.paging.pageableItem.setCurrentPageNumber(page_number).setItemsPerPage(page_size).setTotalItems(result_list_size).setPagingMode("trivial").build />
<#-- the setPagingMode has a few different options -->

<#-- Your code-->
<ul class="message-list">
<#list messages as message>
  <li class="message-item">
   <h2 class="subject"><a href="${message.view_href}">${message.subject}</a></h2>
  </li>
</#list>
</ul>

<#-- Pagination Component using the config we defined above -->
<@component id="common.widget.pager" pageableItem=pageable_item />

I am using LIMIT and OFFSET for the pagination in my rest2.0 call and I'm creating the pagination links with the 'common.widget.pager'. I would assume that this widget would count the amount of items and would show the correct number of pages, but this always shows 5 items, even if i only query 10 items and show 10 per page.

 

Am i doing something wrong or am i forgetting something to make this work?

  • Hi wkennis 

    The offset will have to be constructed dynamically. If you pass the hardcoded offset for every page then it will result in same result for every page. I have modified the code you have posted. Please find below:

    <#-- Gets page number from the URL and defaults to 1 -->
    <#assign page_number = webuisupport.path.parameters.name.get("page", 1) />
    <#-- Gets the total number of results -->
    <#assign result_list_size = rest("2.0","/search?q=" + "SELECT count(*) FROM messages WHERE depth=0 AND board.id ='${coreNode.id}'"?url).data.count![] />
    <#assign offset = (page_number - 1) * 10 />
    
    <#-- gets all the recent messages-->
    <#assign messages = rest("2.0","/search?q=" + "SELECT id,subject,body,view_href,cover_image,author.login,author.id,author.view_href,kudos.sum(weight),metrics.views,post_time, post_time_friendly,search_snippet FROM messages WHERE depth=0 AND board.id ='${coreNode.id}' ORDER BY id LIMIT 10 OFFSET ${offset} "?url).data.items![] />
    
    
    <#-- Your code-->
    <ul class="message-list">
    <#list messages as message>
      <li class="message-item">
       <h2 class="subject"><a href="${message.view_href}">${message.subject}</a></h2>
      </li>
    </#list>
    </ul>
    
    <#-- Pagination Component using the config we defined above -->
    <#assign pageableItem = webuisupport.paging.pageableItem.setCurrentPageNumber(page_number).setItemsPerPage(10).setTotalItems(result_list_size?number).setPagingMode("enumerated").build />
    <@component id="common.widget.pager" pageableItem=pageableItem />

     

    In the above code I have added offest programatically in the query. Also I changed the setPaginMode to enumerated to provide better UI exeprience.


    Kindly check the solution and let me know if this helps 🙂 


  • Hi wkennis 

    The offset will have to be constructed dynamically. If you pass the hardcoded offset for every page then it will result in same result for every page. I have modified the code you have posted. Please find below:

    <#-- Gets page number from the URL and defaults to 1 -->
    <#assign page_number = webuisupport.path.parameters.name.get("page", 1) />
    <#-- Gets the total number of results -->
    <#assign result_list_size = rest("2.0","/search?q=" + "SELECT count(*) FROM messages WHERE depth=0 AND board.id ='${coreNode.id}'"?url).data.count![] />
    <#assign offset = (page_number - 1) * 10 />
    
    <#-- gets all the recent messages-->
    <#assign messages = rest("2.0","/search?q=" + "SELECT id,subject,body,view_href,cover_image,author.login,author.id,author.view_href,kudos.sum(weight),metrics.views,post_time, post_time_friendly,search_snippet FROM messages WHERE depth=0 AND board.id ='${coreNode.id}' ORDER BY id LIMIT 10 OFFSET ${offset} "?url).data.items![] />
    
    
    <#-- Your code-->
    <ul class="message-list">
    <#list messages as message>
      <li class="message-item">
       <h2 class="subject"><a href="${message.view_href}">${message.subject}</a></h2>
      </li>
    </#list>
    </ul>
    
    <#-- Pagination Component using the config we defined above -->
    <#assign pageableItem = webuisupport.paging.pageableItem.setCurrentPageNumber(page_number).setItemsPerPage(10).setTotalItems(result_list_size?number).setPagingMode("enumerated").build />
    <@component id="common.widget.pager" pageableItem=pageableItem />

     

    In the above code I have added offest programatically in the query. Also I changed the setPaginMode to enumerated to provide better UI exeprience.


    Kindly check the solution and let me know if this helps 🙂