ISO FileMaker Magazine

Well now, you really can't get away from it, because most of the Internet is pretty much dependent upon it. Yep, it's JavaScript of course.

So, should you be afraid of using it within FileMaker Pro? No WAY! You should take advantage of it as much as possible. Integrating JavaScript solutions is what makes FileMaker solutions that much more powerful.

In this video, we take a look at using the Google Maps JavaScript API in order to capture latitude and longitude coordinates. Along with that, we look at how you can jump between the free standard Maps URL APIs and how you can create a solution which will allow a user to double-click to capture the desired coordinates.

This type of solution can be used for any situation where capturing initial intended coordinates is desired. Once you have the initial coordinates, you can always send someone out into the field to capture the true coordinates using a copy of FileMaker Go. Whatever your mapping needs are, you can certainly solve the solution with Google Maps JavaScript APIs. You just have to dip your feet into the pool and that's exactly what this video will do for you.

Because of the rich UI experiences which JavaScript provides within a web browser, it makes sense to take advantage of the various possibilities. The difficulty may be putting all the pieces together in order to get something working correctly.

Fortunately, JavaScript isn't just for those "other developers". Those who already know what they're doing. You too, can easily integrate and use JavaScript within your own solutions. You simply need to be ready to learn enough in order to integrate successfully. You need to be a JavaScript integrator.

When you're comfortable with getting data in and out of FileMaker, then you're able to have all those rich experiences which are found within the world of the web browser.

An open source project named Carafe, created by Jeremiah Small, and released by Soliant in April of 2019, has provided a very easy way to integrate various JavaScript resources. In this video I walk through the tool and some of its features. I then show how to take one of the bundles and integrate into a brand new FileMaker file. If you're looking for more reasons to explore the use of JavaScript within your solution then this video provides a great place to start.

JavaScript, it may sound scary because learning any new technology, which includes so much more than FileMaker, feels like an overwhelming amount of new learning. The great thing is, learning just a few little pieces at a time is the best way to learn - little-by-little. So let's start with just a few little pieces.

In this video, I walk through the basics of how you get started with JavaScript within FileMaker Pro. How it's implemented and how to execute things. The great thing about getting started is once you learn a little bit, you tend to get addicted to learning more about what's possible.

It turns out, when a technology, such as JavaScript, takes off as much as it has, you gain a significant amount of technological leverage. You don't have to spend as much of your own time creating "all the things", you just piece together the "various things" to make the "one thing" which is "your thing"! But, as with all things, you need to know what's going on behind the scenes so you can fix, change or troubleshoot what may not work quite right. Which, seems to be the case with all kinds of software development.

Web browsers and their primary language, Javascript, have a very robust ecosystem. In fact, there's few solutions you can't find out in the world of Javascript.

So, in FileMaker, when it comes to our data and its presentation within a user friendly fashion, we can easily create a layout, set it to list view and allow users to simply start using FileMaker.

But, wait, using FileMaker itself isn't always super user-friendly. In fact, you have to learn how to sort by multiple columns by actually heading into a dialog box. Which, admittedly, becomes easier to use, but it's not immediately UI friendly in that you can't just click on the column you want to sort. Let alone select a second or third column and have those sorts apply too.

Enter the world of the Web Viewer and Javascript and it's quite refreshing what you can do and in such a short time. This video walks you through the process of setting up a Javascript library called Datatables. It's a very powerful, and immediately usable UI for working with tabular data. While you can implement the same features within FileMaker itself, it takes quite a bit longer to do so.

While barcodes have been around for decades, and we all know how fundamental they are to everyday life, it doesn't mean your last implementation is still the best way to integrate them. Technology is always changing and it's moving forward while new technologies replace older ones. A barcode which used to be in JPEG format can now be in the scalable SVG format.

In this video, I walk through the use of a JavaScript library which allows for the easy creation of SVG barcodes. This works without a specific font and allows for a scalable file which can be integrated into a PDF or any other type of output. Need barcode support on FileMaker Go on iOS? Need to generate barcodes client side on either Mac or Windows?

If you're building a solution which needs to use barcodes, and you're looking for the least expensive option, then you can't get much better than a commercially free JavaScript library. All it takes is a little bit of know-how and you're creating barcodes in very little time!

FileMaker Pro has a wonderful PDF generator. In fact, one of the biggest benefits of using FileMaker for the purpose of output is that you can make any layout look exactly how you'd like and with a few script steps, you've got PDF output which will fit 95% of the situations you'll come across.

There are, however, certain situations where knowing how to generate a PDF using JavaScript, from within a Web Viewer, will give you the exact results you're looking for.

There are a number of advantages with this approach. First, it can be SUPER fast when generating the PDF and second, you can selectively decide what you want to output from within the whole of your HTML. So, if you're using HTML to present a lot of information, but only want a PDF of a portion of that HTML, then you can certainly accomplish that with this technique.

Even if you don't need the exact functionality of HTML -> PDF output there's a lot to learn from this video if you've never used JavaScript in order to call a FileMaker script and pass in some data.

If you've been learning and using FileMaker for any amount of time, then you'll likely know that FileMaker also has access to JavaScript. It does this through the Web Viewer object which can easily be added to any layout.

For some FileMaker developer's they may answer the question of "Why don't you know/learn Javascript?" with a response of it either being too hard or not being able to take the time to learn it. It' only when FileMaker can't do what what needs to be done when some developers start to look outside of FileMaker's core set of available tools.

The cool thing about JavaScript is that like many tools, it can do a variety of things better than FileMaker alone. I've never come across a single tool which can do it all the best way possible.

If you've never implemented any JavaScript within your FileMaker solution, then this video may be the best way to start that journey. The implementation of a JavaScript based color picker is so easy you'll be craving more and more JavaScript by the end of the video. Whether you need a color picker or the ability to draw content on top of an image file, JavaScript will offer a lot more extensibility than just sticking it out with FileMaker alone!

FileMaker does data, and it does it well - and easily. What FileMaker doesn't do "as" well is data visualization. This isn't because it couldn't. It's because they just haven't been able to focus on it as much. Sure, you can format portals, use repeating fields and use conditional formatting for all kinds of display magic, but you won't realize the same results as you could with a tool or language built specifically for data visualization.

In my humble opinion, they shouldn't work too hard on this either. This is because we have access to technology which provides far more than FileMaker ever can. FileMaker took ages before it had an integrated charting feature. Before that, you had to use a plugin and eventually you could use a remote API through a web viewer.

FileMaker has made a lot of progress with regards to the usability of its charting tool too. It's a great tool for basic data display.

However, when you need to go beyond the constraints of FileMaker's charting tool, the place you'll end up is within the web viewer. Granted, you'll need to shrug off any fear of learning HTML/CSS/JavaScript, but the benefits are well worth the journey.

In this video, I showcase how easy it is to integrate the very powerful JavaScript library D3. It's a power-user's tool which takes full advantage of everything that HTML/CSS/SVG has to offer. Within a world where data visualization is becoming a common form of data communication, this one video provides the first step of many towards taking advantage of some very powerful tools!