Master DataTables in Claris FileMaker Pro

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 below and view the series in order to get the most out of your learning experience.

Series 1:

• Mastering DataTables Series: 1.1 Demo File
• Mastering DataTables Series: 1.2 Naming & Report Settings
• Mastering DataTables Series: 1.3 Adding your Data
• Mastering DataTables Series: 1.4 Working with Columns
• Mastering DataTables Series: 1.5 HTML & Previewing Your Build 

Series 2:

• Mastering DataTables Series: 2.0 Introduction to JS Function
• Mastering DataTables Series: 2.1 DataTables Libraries
• Mastering DataTables Series: 2.2 DOM Elements
• Mastering DataTables Series: 2.3 Searching
• Mastering DataTables Series: 2.4 Pagination
• Mastering DataTables Series: 2.5 Page Length
• Mastering DataTables Series: 2.6 Other DataTable Settings

Series 3:

• Master DataTables Series: 3.0 Modifying Columns
• Master DataTables Series: 3.1 Overview of Columns Builder
• Master DataTables Series: 3.2 Column Titles
• Master DataTables Series: 3.3 Column Visibility
• Master DataTables Series: 3.4 Column Searching & Ordering

Series 4:

• Master DataTables Series: 4.0 Introduction to On-click Integration
• Master DataTables Series: 4.1 Integration Settings
• Master DataTables Series: 4.2 Adding a Row On-Click
• Master DataTables Series: 4.3 Adding a Cell On-Click
• Master DataTables Series: 4.4 Adding a Button On-Click to a Row
• Master DataTables Series: 4.5 Adding a Button On-Click to the Table

Series 5:

• Master DataTables Series: 5.0 DataTables Styling & Rendering
• Master DataTables Series: 5.1 CSS Table Formatting
• Master DataTables Series: 5.2 CSS DataTables Elements
• Master DataTables Series: 5.3 CSS Column Formatting Using Classes
• Master DataTables Series: 5.4 CSS Column Formatting Using Render Functions
• Master DataTables Series: 5.5 CSS Formatting with Graphics

Introduction

In this post, we’ll delve into the heart of the training series by providing an in-depth overview of the DataTables Builder, and we’ll also showcase our first demo file.

As a Claris FileMaker Pro developer, I tend to find ways to work efficiently, whether that is re-purposing my existing code, writing in a modular framework, or in this case, using another method to complement my development.

I stumbled onto DataTables several years ago while building an in-house application from scratch.  I’m sure most of you have similar experiences; you find yourself creating layout after layout for the various list views that the users need to operate the system.  At one point, I thought, there must be a more efficient way to develop this growing system.  I found it in DataTables.  I knew little to nothing about how it all worked, but the result was enough to make me a believer.

What is DataTables?

If you have not heard of it, head to datatables.net to get acquainted with this resource. DataTables provides a robust framework for organizing and displaying data, making it an indispensable asset for any Claris FileMaker developer. With a structure akin to Excel, you have columns and rows to store and manage your data, with the advantage of the web’s interactivity.

The best part? DataTables is not tied to any specific backend language or database system.  We can embed this HTML table directly into Claris FileMaker solutions using a web viewer, and it comes with slick features right out of the box, such as pagination, ordering, and searching, eliminating the need for additional programming. It works with HTML tables and can easily integrate into your Claris FileMaker solutions.

Introducing DataTables Builder

Fast forward a few years, and now working with Codence, the opportunity to use DataTables presented itself again.  This time around, I wanted to learn and understand what was happening “under the hood.”  I was already hooked on what DataTables could do; now, I just needed to improve my skills to take full advantage of the possibilities.

I am not an expert at Visual Studio or other code editors, and I think the learning curve of those applications was a barrier for me to grasp DataTables. Many DataTables examples are on the internet,  but not many were associated with Claris FileMaker Pro.  I needed a way to “play” or practice with DataTables in a familiar format. 

I thought, “Why don’t I use the software I am familiar with and use every day to teach myself DataTables?”  What better way to learn than by trial and error and real-world examples?  Henceforth, the “DataTables Builder”, a custom application I developed with Claris FileMaker Pro. 

The DataTables Builder has undergone several iterations and improvements since I first created the tool. At some point, there may be others out in the development world that could benefit from something like this too.  I have absorbed so much knowledge from the Claris FileMaker Community members over the years… maybe it is time to share what I have learned with you.

Video Training Series

I decided to create a video training series, partly because I like to explain my thinking and rationale but also because I prefer to learn by example. The video series is aimed at showing you how to do something but providing you with a demo file to try it yourself.  The videos act as a guided assistant – but you control when, where, and what you learn.

Most video tutorials will come with an associated demo file that you can use for your learning.  As the series progresses, so will the demo files, building upon previous lessons.  The goal is to allow you to learn at your own pace. By the end of the series, you should be able to understand DataTables and its underlying principles to create your builds and implement them into your solutions.  The videos are meant to be short so you can understand and practice each concept.  Each video will be clearly labeled to find a specific area you want to review again.

Let’s get started

This first video in this series does not include a demo file, but rather re-iterates why one might want to implement DataTables in their solutions.

If you are still uncertain what DataTables can do or need to explain the benefits of its use to others, watch these videos.

Do things better than you can do in Claris FileMaker

• Filtering
• Dynamic Sorting
• Dynamic Width
• Chart Integration

Do things you can’t do in Claris FileMaker (or at least not easily)

• Drag & Drop Reordering
• Row Grouping
• Expand/Collapse Rows
• Data Rendering

Do things differently from Claris FileMaker

• Displaying JSON Data
• Re-Design on the fly
• Export with the effort

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.

In the next post, we will look at the Demo File and get an Overview of the DataTables Builder.