mobile-logo

FileMaker Clockpicker using Bootstrap and jQuery

image
12 Jan

FileMaker Clockpicker using Bootstrap and jQuery

by Aaron Giard
in FileMaker, Ideas, Innovation
Comments

In this post you will learn how to implement an intuitive web-based FileMaker Clockpicker using Bootstrap and jQuery in a few easy steps. Watch the tutorial and download the demo.

 

The Problem – Entering Time is Cumbersome

As a FileMaker developer and web developer, I often found myself in need of some way for a user to specify a time for some piece of data such as a calendar entry for an appointment or a deadline for a project. Typically this is tediously done with a painstaking entry of all hours and minutes in 15 minute increments or perhaps two separate value lists with hours and minutes. Then there’s the extreme version where you need 12 and 24 hour formats driven off of a table of records.

 

Whichever method you choose, none are very elegant from the developer’s standpoint nor are they very user friendly. I mean, who really wants to scroll through a giant list of times in order to find the correct one? Personally I can’t stand it and I knew there had to be a better way to do this so I began looking for a web based solution that I could easily implement into a FileMaker solution to make this nightmare end.

 

The Solution – The FileMaker Clockpicker

As usual, I landed on a great Bootstrap/jQuery plugin that is simple to setup and super intuitive. This turned out to be the perfect solution to an old problem that had never really gotten much attention so I decided to share this new FileMaker Clockpicker technique with you.

 

In the video below I will show you how to implement this great FileMaker Clockpicker into your own solution in a matter of minutes. A free sample file is included at the end of this post to help you get started.

[vc_separator]

Watch The Tutorial

Thanks for stoping by to read this post. Feel free to comment on what you think of this technique.

As always, keep pushing the limits of what FileMaker can do!

Best regards,
Aaron Giard

Download the Free Demo File

Fill out the form to receive your free demo file.





    Tags:
    ,,,,,
    Aaron Giard

    Aaron has been a developer for 18 years with a focus on database-driven web applications. He spent 17 years in the print industry as a prepress manager and designer with a large focus on workflow design and automation. He was a speaker at the 2015 FileMaker Developer's Conference to a class of over 300 attendees. He also enjoys hiking with his family, playing guitar and drums, cooking high-end food, and photography.

    16 Comments
    • Pingback: FileMaker Clockpicker using Bootstrap and jQuer...
      Posted at 11:34 pm, January 12, 2017
    • Pingback: FileMaker Clockpicker using Bootstrap and jQuer...
      Posted at 1:36 pm, January 13, 2017
    • Stephan Bansemer
      Posted at 11:31 am, January 15, 2017

      Great work, Aaron !

      Thanks for sharing.

    • Some Filemaker guy
      Posted at 12:30 am, February 4, 2017

      Great stuff. Unfortunately on the file that you provided, webviewer and popup come up as a big blank white box with no content. Running Filemaker 15 on Windows.

      • Aaron Giard
        Posted at 4:11 pm, February 17, 2017

        Hi, Sorry for your issue. Unfortunately, I have not had a chance to test in FileMaker on Windows. As soon as I can I’ll look into this issue and revise the file. thanks for the heads up!

    • Jeroen Lutmers
      Posted at 8:39 pm, February 6, 2017

      What if download link does not come?

      • Kyle Williams
        Posted at 8:01 pm, January 17, 2018

        The link did not show up for me either…..

        • Kyle Williams
          Posted at 8:30 pm, January 17, 2018

          I reloaded the page in Safari and tried again. the link showed up just fine, however the zip file seemed to be corrupted and I was not able to extract it with any of my zip file extraction programs.. I would have really liked to see this in action. If anybody has the fmp12 file and can send it to me, that would be great!

          • Aaron Giard
            Posted at 8:34 pm, January 17, 2018

            Hi Kyle,

            The file has been replaced. Apparently server updates corrupted the .zip. All should be well now. Thanks for reading. Keep in mind that this file was developed using FileMaker 15 and changes in FileMaker 16 have caused this file to not work as expected in FileMaker 16. I am working on an updated version to circumvent the issues with FileMaker 16. Anything prior to FM 16 should work as expected.

        • Aaron Giard
          Posted at 8:32 pm, January 17, 2018

          Hi Kyle,

          You should receive an email with the link to download the file. If you do not see the email, please check your spam folder.

    • Magnus Hallberg
      Posted at 1:04 pm, January 17, 2018

      Hi. Thanks for sharing. I can´t seem to open your demofile. Seems to be an error in the package. Can you provide a new zip?

      • Aaron Giard
        Posted at 8:31 pm, January 17, 2018

        Hi Magnus,

        Thanks for the info. The file has been replaced. Apparently server updates corrupted the .zip. All should be well now. Thanks for reading. Keep in mind that this file was developed using FileMaker 15 and changes in FileMaker 16 have caused this file to not work as expected in FileMaker 16. I am working on an updated version to circumvent the issues with FileMaker 16.

        • Guido
          Posted at 1:05 pm, January 27, 2018

          Hi Aaron,
          when Do you think you will have the file for FM 16 ready ? I Do want to harass you but I could use this perfectly right now … ;.)
          Best regards
          Guido

          • Aaron Giard
            Posted at 3:50 pm, January 29, 2018

            Hi Guido,

            I have updated the file for version 16 and it also now includes a card window version as well as the popover version. Enjoy and thanks for reading!

            • Guido
              Posted at 3:43 pm, January 30, 2018

              Hi Aaron,
              thanks a lot ! This is perfect.
              all the best!

              Guido

    • Mariusz Klecha
      Posted at 2:15 pm, October 8, 2019

      Hi Aaron
      Nice technique !!

      I would love to check it but In FM 18 does not work, FM it’s backward compatible, any ideas what can be wrong ??

      I have the same problem like “Some Filemaker guy”. I did make reload instead of Reset, then time picker shows up, but if I click on it – is disappears
      Thanks in advance