Home

Alphabetic Search Buttons using Button Bars in FileMaker 14

August 10, 2015 by Douglas Alder Comments Off on Alphabetic Search Buttons using Button Bars in FileMaker 14


FileMaker Pro 14’s new button bar brings a new twist to an old technique for creating alphabetic searches of your data. Instead of creating 26 individual buttons it is possible to create a single button bar object and then easily reformat it using text style changes or FileMaker CSS style changes. The button bar can also be repurposed to horizontal or vertical layouts. Finally I demonstrate how to use the same script from different contexts to perform different searches — a list search and a portal filter.

Horizontal Example – List Search

Clicking (or tapping in iOS) on a letter results in a search in the list based on the last name of the person.

Multiple examples of the button bar are displayed to demonstrate two things:

1) Apply text formatting to get ALL CAPS

2) Apply style change to dynamically change the look of the alpha search bar.

Vertical Example – Portal Filtering

The button bar on the left is the same button bar used in the horizontal example. No changes were done to the button bar, except to make it run vertically. The behavior changes are determined in a single script.

  1. Tap on a letter in the button bar
  2. A merge field displays the global letter that is set to filter the portal
  3. All people with a last name beginning in the letter ‘C’ are listed.

Button Bar Setup

The basic idea is to assign every button on the button bar to the same script, with just the button label and the Script Parameter changing. Unfortunately there does not seem to be a way for FileMaker to get the label name, which would save a step of assigning a variable.

Assign each button to the same script with a different script parameter

Each button has a Script Parameter assigned to a letter of the alphabet that is the same as its button label name.

Reuse the same script

The script can be reused on different layouts for different types of searches. Rather than taking the time to reset 26 buttons in the button bar to a new script, simply put a switch in the script to look at the context the script is being run from. In this case, I chose Get(LayoutTableName) as the switch, on the premise the the underlying table name is not as likely to change as the Layout Name.

Changing the orientation of the button bar

One click is all it takes to change from vertical to horizontal buttons.

Styling the Button Bar

The button bar is remarkably similar in a number of the main CSS styles that FileMaker has in the built-in Themes. If you like black or grey, you will be thrilled with the choices. That said, it is fairly easy to create and add your own style to a theme. The bonus is that you only have to change the style on a single object, the button bar, not 26 individual buttons.

Demo File

Download the demo and play with this useful new feature of FileMaker 14.

Add a Button Bar Alpha Search to your Solution

You may want to add an alpha search button bar to your own solution. To incorporate the button bar into your own database, do the following:

  • Copy and paste the Alpha Search script into your solution
  • Copy and paste the button bar onto the appropriate layout
  • Modify the Alpha Search script  to your own needs
FileMaker Pro 14, FileMaker Pro Techniques
, , ,

Comments are closed.