Displaying Paginated Database Results

When you have lots of items to list, sometimes there's more than you want to show on one page. The universal solution to this is pagination: break the list up into some number of pages, with a maximum number of items per page. Of course, you then need some sort of control to navigate between the pages.

With and Without Pagination

Webvanta provides a very easy-to-use pagination feature that you can apply to any database content. Suppose, for example, that you have dozens or hundreds of articles. You could list all of them, like this:

<w:kb:item:each>
    <h2><a href="<w:path url='article' />"><w:name /></a></h2>
    <p><w:description /></p>
</w:kb:item:each>

But that page could get awfully long, and take a long time to generate (if it is not cached). Here's the same code, modified to paginate in pages of 10 items each:

<w:kb:item>
  <w:paginate by='name desc' limit='10' start='1' page='auto' type='article'>
    <div><w:pagination_widget /></div>
    <w:each>
      <h2><a href="<w:path url='article' />"><w:name /></a></h2>
      <p><w:description /></p>
    </w:each>
  </w:paginate>
</w:kb:item>

Note that the paginate element needs to fit in between "w:kb:item" and "each", which are combined onto one line in the first example. In the second example, we split that statement into two lines, and insert the pagination statement and the pagination widget between them:

<w:kb:item>
  <w:paginate by='name desc' limit='10' start='1' page='auto' type='article'>
    <div><w:pagination_widget /></div>
    <w:each>

Setting Pagination Options

The paginate statement (second line above) tells Webvanta to break the database contents into page-sized sections, and display only the current page. You can set a variety of parameters, as defined in the table below. These are mostly the same as those for kb:item:each.

Pagination Widget

To display the pagination widget wherever you want, simply insert the code <w:pagination_widget />. This returns the HTML code for the set of page numbers and previous and next controls, such as this:

Each page number displayed in the widget is linked to the same URL as the current page, but with the value of the page parameter set.

You can start with the default settings for the pagination widget, and you can add styling via CSS; you only need to make changes to the widget's parameters if you want to customize its HTML.

The table below summarizes the pagination widget options: