Freemarker/Pagination

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.

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.

It's not the exact same use case, but I think this example will help get you going in the right direction since it demonstrates making REST API calls via AJAX:

http://lithosphere.lithium.com/t5/Developers/Ajax-search-Before-Post-Freemarker/m-p/23874/highlight/true#M117

Note that if you're going to be making REST API calls via AJAX, you'll need to ensure that your users have sufficient permissions to make REST API calls. You can grant those permissions as needed via the Community Admin.

Back a little bit, with the second option, is there a solution to make the results available to search engines? With the AJAX approach, crawlers wouldn't be able to see past the first page (or possibly even the first page results). 

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

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.

Thanks for your answer AdamN.

I'm indeed trying to implement a paginatin for my custom component on ForumPage.

So is there a way to change the name of page parameters of the pagination custom object ?

So instead of having for exemple www.community/.../page/7  I would have something like www.community/.../c-page/7 for exemple.

If no, How do I build a custom paging mechanism ? are the 2 method above are the only ways ? 

niten

I was wondering that as well, but didn't see a way to set the page parameter name for the pagination context object. That would be a nice enhancement. I'd strongly encourage you to submit it to our idea exchange for consideration.

If you want to use custom pagination on a standard page such as forum page, you're likely going to need to build your own paging mechanism. You would need to read your custom parameters (ie. "c-page"), do the necessary math (determine the number of pages, which pages to show in the list, etc), and then output the necessary HTML to create the page links using your custom parameter.

I assume this custom component isn't the main focus of the forum page, right? You're still using the forum page as a forum page, and this custom component is perhaps in the side bar or at the bottom? If it's not the main focus of the page, I'd advise against pagination and instead encourage you to use something like a "View All" or "See More" link. That could like to a custom page where you can then implement pagination using the context object.

In fact, the component is the main focus of the page.

I'm still using the ForumPage as Forum Page, but instead of message-list I create a custom component because the data shown and the way they are display now is completely different. I didn't want to re style the message-list component (sometime re-style default component in Lithium is a pain in the a**), so I create my own...

I guess I will have to create my own paging rootine.

Thanks again for your intel.

niten