Popup Pickers

Back in 2009, David Graham released a demo called Spotlight Filter that caused a minor revolution in the FM development world: a) it neatly solved a problem that many developers routinely face, and b) it was an early and convincing implementation of FileMaker script triggers.

The problem it solved was, “How can I provide my users with a lightning-quick, keyboard-driven popup-window to pick from a set of values, for example, to add a customer or a product to an invoice?”

Historically I’ve tended to be skeptical of “pseudo dialogs” (using a FileMaker window to simulate a modal dialog) because many of my clients are on Windows, and there is an annoying windowing behavior that can arise under certain circumstances: if your background window is maximized, it will not stay maximized if you attempt to display another window in front of it in a “windowed” state. However, as screen resolutions have increased over the years, this has become less of a concern than it formerly was.

But note: if you deploy on the Windows platform and your design methodology relies on the active window being maximized, then this technique is not for you.

At any rate, I decided to use Spotlight Filter on a project recently, and made some changes which I found useful, and thought perhaps others would as well. I discussed these changes with David Graham, and he offered some observations and suggestions, which I  incorporated. This article’s demo file, Popup Pickers, is offered with his permission.

But first a bit of background. Geoff Coffey’s informative piece about Spotlight Filter is required reading in my opinion. There’s no point in rehashing what Geoff has already explained concisely, so I will proceed on the assumption that the reader is familiar with it.

Next, I will risk stating the obvious: the purpose of a “picker” is to allow the user to search a set of records by typing in one or more search terms; these terms can be fragmentary (“jo sm”) or complete (“john smith”), and the order of the terms is not important. When the desired record has been located and then selected, the primary key for that record is inserted into a foreign key field in the appropriate target table.

So, what changes will you find in the current demo?

  1. Includes a primitive invoicing system
  2. Something actually happens when you “pick” a record
  3. The picker auto-centers in front of the source window
  4. Modal behavior
  5. Completely keyboard driven
  6. Uses scripted find + list view, rather than relationship + portal
  7. Uses some new-in-FM 11 features

Let’s look at at each of these in closer detail.

1. Includes a primitive invoicing system

(See next comment.)

2. Something actually happens when you “pick” a record

The beauty of Dave’s original demo is its simplicity: a couple layouts, three scripts, just the essentials, and make of it what you will. But I figured a simulated real-world implementation wasn’t such a bad thing either. In the new demo, you can pick both customers and products.

3. The picker auto-centers in front of the source window

This is useful code to have, if it’s not already part of your FM tool kit. Note that we don’t want the picker to center in the middle of the screen, but relative to the background window.

I could have used “adjust window (resize to fit)” rather than explicitly coding the $dialogWidth and $dialogHeight variables, but the dialog draws more cleanly on the screen this way. I actually do perform an “adjust window” a bit later, but that’s after the popup picker has already been centered.

4. Modal behavior

A modal dialog is one that stays in the foreground until dismissed; while the modal dialog is on screen, other windows cannot be interacted with. It’s a not-very-subtle form of user coercion, which facilitates the enforcement of business logic.

5. Completely keyboard driven

a) Esc dismisses the dialog (without picking anything)
b) Up and Down arrow keys navigate between matching records
c) Return or Enter selects the current item

And of course search results update in real time as you type; this isn’t a change — it was the whole point of Dave’s original demo.

6. Uses scripted find + list view, rather than relationship + portal

By using scripted finds, we give the user a lot more flexibility re: the terms they use and the order they type them in. We also dispense with relationships, custom functions and the indexing overhead of the exploded foreign key in the original demo. If the user is familiar with FileMaker search operators, they are welcome to use them, e.g.,

For products containing the word “chard”, but not “chardonnay”, search on “=chard”

For products beginning with “white”, search on “==white*”

7. Uses some new-in-FM 11 features

a) Merge Variables

b) Variables in scripted find requests

Finally, a few words about the script triggers. There are three picker layouts in the demo… all three of them have the same OnLayoutKeystroke trigger: “pp: process keystroke?” I used OnLayoutKeystroke rather than OnObjectKeystroke, because I want keystrokes to be processed whether or not the user’s cursor is in the search field.

The search field also has an OnObjectModify trigger, which varies depending on the layout.

As with all of my demos, this one is a starting point, not the last word on the subject. I invite you to pull it apart, and change it to suit your needs. And naturally if you see room for improvement, I hope you’ll post a comment here.

10 thoughts on “Popup Pickers

  1. Bernard De Jonghe

    Dear Mr. Frank,

    I would like to say thank you to you. Your Popup Pickers solution is exactly the answer to a problem I wanted to solve. I maintain my own database, but I’m not a professional database developer. I would never have been able to find this on my own.
    Thanks to people like you newbies can learn by doing.
    Thank you again!

    Bernard De Jonghe
    Beersel, Belgium

    Reply
    1. Kevin Frank Post author

      Thank you Bernard. Obviously the major credit goes to David Graham, since my demo would not exist had it not been for his original (which I used as a starting point with his permission). At any rate, I’m glad you found the demo useful, and that you took the time to say so.

      Reply
  2. S. Kearton

    Great technique Kevin!
    Have you ever modified this so a user could select more than one item from the filtered list to add to an invoice?

    Reply
    1. Kevin Frank Post author

      No I haven’t… mainly because a) it hadn’t occurred to me, and b) none of my clients has requested that capability. But it sounds like a great idea. Right now the demo is keyboard-driven… you’d need a mechanism to “tag” the records… (via keyboard it could be a press of the space bar; via mouse you’d need to change the current behavior) I would probably use $$variables and conditional formatting, rather than a check box, to avoid multi-user collisions. And what happens if the user tags records one and two, but is on record three when he hits Enter? Food for thought…

      Reply
    2. Tom R.

      I implemented Kevin’s popup picker solution (which is great, & thank you very much, Kevin) in my own solution, where the pp: begin script is called from my own Link Person script. To allow for the user to make multiple selections, I added a “perform script” script step at the end of the pp: make selection script, which calls my Link Person script. So it’s more like serial selections instead of multiple selections. But the user can keep adding selections until hitting the escape key.

      Reply
  3. S. Kearton

    Yes, I can see where you are going. This is a great tool if one only needs to select a single item at a time, and of course there are many places in my database to do that. I guess I will need a more robust picker window when they need to select multiple items at a time and I’ve built something for that but it is the “modal” scripting that is a bit hard to wrap my head around, so that a user, must do something in the popup window before they can close it. Wonder if Filemaker will ever create a better modal window system in future versions?

    Reply
  4. Symeon

    Kevin – thanks so much for this – it works a dream in your downloaded demo, so with your kind permission, I’m going to use it in my recipe db that I’m building to easily search and pick foods from a 4000+ ingredient list.

    However, I have a question. I am running Filemaker Pro – not Advanced. Whilst your demo works perfectly, after I have copied all the scripts and replaced your field settings with my fields etc, the incremental search still works but doesn’t show me the found set as a list – just one found item at a time and I have to use the up and down arrows to see the other items of the found set in order to select one.

    I’ve checked and checked all the scripts and all I can put it down to is the Install Menu Set [“Product Picker”] in the pp: begin script.

    As I only have Pro and not Advanced, it works in your demo, but I cannot export or amend the Menu Set in Pro as there’s no facility to do so as I have to just use Filemakers default set.

    Could this be the problem in which case I’d need to upgrade – hoping it’s not as I don’t have the need for the Advanced version as yet.

    Many thanks in advance.

    Reply
    1. Kevin Frank Post author

      Hello Symeon,

      A few thoughts… FileMaker Advanced with its Data Viewer, Script Debugger, ability to define/manage Custom Functions, Custom Menus, etc. is probably the best investment you can make. I write all my articles on the assumption that the reader will own FMA, because I honestly can’t imagine doing FM development without it.

      But I don’t mean to lecture you, just felt like I had to share that.

      Moving on to the issue you’re seeing, I don’t think it has anything to do with Menu Sets, but rather the default view for the layout, which I’m guessing is currently set to “Form” view, and needs to be changed to “List” view. (Or you can insert a “View As List” script step, if you prefer… I like to set a default view for a layout and turn off the other views, but I won’t pretend to have been 100% consistent with this practice in my demo files.)

      If that’s not the issue, please feel free to email me a clone of the file, and I’ll be glad to take a look.

      Regards,
      Kevin

      Reply
  5. Symeon

    Bingo! Perfect Kevin – Thank you so much… I can’t believe I didn’t think of that myself… doh..!

    I think I will purchase FMA in a few months anyway as my skills are progressing.

    Many thanks again!

    Symeon

    Reply

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s