ZK Developer's Guide/ZK in Depth/Live Data, Paging, setModel and Implement your own renderer/What's Paging

This documentation is for an older version of ZK. For the latest one, please click here.

Paging separates long content into multiple pages.

A paging component is used for this purpose. For example, assume that you have 100 items and prefer to show 20 items at a time, then you can use the paging components as follows.

<paging totalSize="100" pageSize="20"/>

Then, when a user clicks on the hyperlinks, the onPaging event is sent with an instance of PagingEvent to the paging component. To decide which portion of your 100 items are visible, you shall add a listener to the paging component.

<paging id="paging"/>
<zscript>
     List result = new SearchEngine().find("ZK");
     //assume SearchEngine.find() will return a list of items.
     paging.setTotalSize(result.size());
     paging.addEventListener("onPaging", new EventListener() {
             public void onEvent(Event event) {
             int pgno = event.getPaginal().getActivePage();
             int ofs = pgno * event.getPaginal().getPageSize();
             new Viewer().redraw(result, ofs, ofs + event.getPaginal().getPageSize() - 1);            //assume redraw(List result, int b, int e) will display
             //from the b-th item to the e-th item
         }
     });
</zscript>