Master DataTables Series: 2.4 Pagination

Welcome to the multi-part video series that will teach you how to implement DataTables in your Claris FileMaker Pro solutions effectively. Whether you prefer reading, watching videos, or trying out demo files, we’ve got you covered. If you’re new to this series, we recommend starting from the introduction to get the most out of your learning experience. You can access the complete series here: Master DataTables with Claris FileMaker Pro.

In the previous post, we discussed the native searching feature in DataTables. Specifically, we learned how to use and control the search (or filter) option in your DataTables report.

In this post, we focus on the features and functionality of pagination, or the ‘p’ DOM Element within DataTables.

Pagination Overview

Pagination is a feature in DataTables that controls the presentation of pages in a report. By default, the system automatically determines the number of pages based on the number of entries and the page length setting. It is especially useful for managing the display of entries in large datasets.

Controlling Pagination Appearance

As we learned in the prior post, there are two main approaches to controlling the appearance of an element in your report. Like the search feature, we can toggle the pagination control on or off, affecting its presence when previewing the build.

Option 1: Modify the DOM Elements

We can control whether pagination appears on the report by modifying the values we set for DOM elements.

The default DOM arrangement is constructed like this:

lfrtip

If we want to prevent the user from being able to navigate pages on a report, we can remove the ‘p’ (pagination) like this:

lfrti

Option 2: Control the JS Function’s settings

We can also disable pagination for specific reports. Even if the DOM element has pagination enabled (example: lfrtip), we can toggle the pagination feature on or off in each individual report’s settings.

The syntax that appears in the DataTables settings would appear like this:

paging: true

or

paging: false

Demo File & New Features

The demo file (see bottom of blog post to download) for version 2.4, includes some new features that were introduced to the DataTables Builder. Prior to this version, the ability to toggle pagination on or off for specific reports did not exist. This new field, labeled “paging”, was added to provide the same experience for controlling a report’s search functionality.

In addition, a new settings option, “paging type”, which controls the appearance of the pagination control, has been included. It offers the developer six options for adjusting the display.

In the video tutorial, I demonstrate how to apply these new pagination features and options for arranging DOM elements to change the position of pagination. I also showcase the various “paging type” settings for different pagination element appearances.

As developers, we can control pagination visibility and appearance to set the report’s tone. However, there are even more settings that allow our users to interact with the reports we build.

What’s next?

In the next post, we expand our learning of the pagination DOM Element by digging deeper into Page Length Options. These DOM Elements control how pages are presented in report previews, but they can be controlled independently. We will investigate how we can modify our reports based on user input, such as the number of entries per page.

Join the Training Series Now

Subscribe to our YouTube channel to keep up with the video training series. Comment on the YouTube videos to interact with us and share your thoughts and questions. Also, don’t forget to join our mailing list for updates on new videos and additional resources.