Forum Discussion

Inactive User's avatar
Inactive User
13 years ago

Freemarker/Pagination

Scenario: I'm getting blog post information and displaying it in a custom component bu using a #list and rest call. I'd like to be able to limit how many blog posts show up using page_size (which I can do) but I also want to have pagination links above the content so that a user could dynamically view the second page of posts without having to reload the whole page. Is that possible? If so, could someone point me in the right direction? Thanks.

  • AdamN's avatar
    AdamN
    12 years ago

    Oh, so are you still showing a list of topics like usual, except that it's formatted/styled differently? If you have the same number of items, you should adjust either the setting in the admin or the page size in your component so that they're in alignment. The issue comes if the number of pages is different between what the component says there should be and what the forum page is expecting.

  • AdamN's avatar
    AdamN
    Khoros Oracle
    13 years ago

    There are a couple different ways to approach this, but either way is likely going to require some JavaScript.

     

    First Approach

     

    One way to approach this is to preload the maximum number of messages you'd want to page through in the component. You'd use the rest FreeMarker Context Object and set your page_size to be that maximum. Then you could use the freemarker "chunk" built-in to get the posts a certain number at a time. You'd just set the chunk size to however many you want to show on each "page". Then with a combination of JavaScript/CSS you can hide/show the appropriate page as desired.

     

    Pros: Easier than the next approach, minimal JavaScript coding required

    Cons: Less efficient, less flexible since you can only have a fixed number of messages to page through.

     

    Second Approach

     

    Alternately, you can use AJAX to make calls to the REST API dynamically, and then update your component with the results you get back from the REST API. You would just pass through your page_size and page parameters to the REST API call. Freemarker isn't going to help you much in this case, it will be mostly JavaScript required.

     

    Pros: More efficient, can page through the entire result set

    Cons: More advanced coding required JavaScript

     

     

    If you're just wanting a fixed number of pages, I'd suggest the first approach. If you want to be able to page through everything available, I'd suggest the second approach. Let me know if any of this doesn't make sense or is unclear.

    • niten's avatar
      niten
      Guide
      12 years ago

      Hi everyone.

      I'm doing a little up on this message because I'm trying to create a custom pagination myself, and I'm encountering some unexpected issues.

       

      I tried to use the context object for pagination which I though could mix the pro of both AdamN solutions.+ I wanred to allow the user to arrive directly to any page they want by passing it in the url (which can't be done with the Ajax method).

       

      So, I tried something like that :

       

      <!-- nombre de thread -->
      <#assign thread_count = rest("boards/id/${cat_id}/threads/count").value/>
      
<!-- nombre d'item par page -->
<#assign itemPerPage = 6/>

<!-- page courante (par default 1 ) -->
<#if webuisupport.path.parameters.name.get("page")??>
	<#assign page_number =  webuisupport.path.parameters.name.get("page")  /> 
<#else>
	<#assign page_number = 1  /> 
</#if>

<!-- Instanciation pagination -->
<#assign pageable_item = webuisupport.paging.pageableItem
  .setCurrentPageNumber(page_number)
   .setItemsPerPage(itemPerPage)
    .setTotalItems(thread_count?number)
     .setPagingMode("enumerated")
      .build />

<!-- REST requête avec les paramètres au dessus -->
<#assign thread_list = rest("boards/id/${cat_id}/threads?restapi.response_style=view&page_size=${itemPerPage}&page=${page_number}")/>

       So I though that using the default link in the pagination item, and the page parameter to create different rest request each time I change page

       

      It worked fine on dev server, but on production where we have a lot of thread, I see than I can't go through every page.

       

      For exemple, I have a board with 129 entry, so logically I've got 22 pages in my pagination item. It works fine until page 5, but I can't go over this page. I can click page 6, 17 or 22 it will always send me back to page 5.

       

      What's more weird is that I tried page 6, 17 and 22 directly in the rest request, and It works fine.

       

      So I don't have a clue whi I'm stuck here.

       

      Can somebody help me ?

       

      Thanks,

      niten

      • AdamN's avatar
        AdamN
        Khoros Oracle
        12 years ago

        Depending on what page you're using the component on, you could be conflicting with the core pagination logic. For example, let's say you place your custom component that includes pagination on a forum page. For simplicity let's say your page size for both the forum page and the custom component is 10, but your forum only has 100 items to page through and your custom component has 200 items to page through. The forum will have 10 pages of content, and your component will have 20. If you try to access page 15 of your component, the forum page is going to think you're also trying to access page 15 of the forum content, but there are only 10 pages of forum content so it's going to stop you there.

         

        I'd say there are two main use cases that come to mind for the pagination context object:

        1. Replacing the standard pagination component for a standard page that supports pagination (ie. perhaps you want to use a different paging mode)
        2. Adding pagination to a custom page, where it won't conflict with any standard pagination.

        If you do want to have pagination for a custom component on a standard page that supports pagination, you're likely going to have to build a custom paging mechanism and use a parameter name different from "page" so that you don't conflict with the standard pagination.

    • Inactive User's avatar
      Inactive User
      13 years ago

      Second option, definitely. My question now is, and its probably around but I haven't seen it yet, is how to make local rest calls using Javascript. Could you just point me in the right direction? I haven't done a lot of AJAX before and I've only ever made the rest calls within <#list> tags and what not. Thanks for your help.