Demonstration

The example we will be using is a follow-on from the previous article, in which we showed a method for displaying data of companies and contacts. We displayed the FileMaker data in a jQuery datatable in the FileMaker Web Viewer, which allowed us to include jQuery features like pagination and sorting without any coding. Using the FileMaker.PerformScript() function, we can add the functionality through which, once the user clicks on any of the contact records from datatable in Web Viewer, the chosen contact details are shown on the FileMaker card window.

The FileMaker.PerformScript() function takes two input parameters:

1. FileMaker Script Name – A non-case-sensitive name of the script we wish to run
2. Script input parameters (optional) – a string that contains the required parameters, which can be read using the function Get(ScriptParameter).

This FileMaker script can be called from the WebViewer using the following JavaScript function: function performFileMakerScript() {
FileMaker.PerformScript ( “FileMaker Script Name”, “Optional Parameter” );

The highlighted section from the above screenshot shows how to call the FileMaker script using ‘FileMaker.PerformScript() function from Web Viewer. In it we write a JavaScript function called showContacts(), in which we can specify the execution for a double click event. We specify that a double click event calls the FileMaker script called “Show Contact Details”, passing the ID parameter as the optional second parameter. The ID parameter is retrieved from the double click event, by identifying the datatable row that has been clicked. This id parameter is further used in the FileMaker script to get more details of the selected contact record and displayed in the FileMaker card window.

A few notes regarding this implementation:

• In the Web Viewer Setup dialog, you must select the setting “Allow JavaScript to perform FileMaker scripts”. Otherwise, the FileMaker.PerformScript()function will not work.
• The FileMaker script name which we pass as a first parameter is not case-sensitive.
• The FileMaker.PerformScript() function doesn’t wait for the FileMaker script to finish. That means the FileMaker script doesn’t return a value to the FileMaker.PerformScript() function that called it.
• The FileMaker script is executed in the current context. So if the user or script changes the layout or record while the script is running, then the FileMaker script will run in a new context. To deal with such a situation, we can pass the context information as a second parameter to the function.

The JavaScript integration in FileMaker 19 platform allows creating custom apps that can use the existing JavaScript libraries to incorporate amazing functionality easily. It enables a seamless ability to pass data back and forth between FileMaker and JavaScript.

If you are looking for support with FileMaker, or FileMaker integration, feel free to contact our us. For more details, please visit – www.metasyssoftware.com/filemaker

Card Windows are modal to its parent window and allows the display of context-independent information from the parent window. Using the card window, users can perform actions without navigating from the parent window.

We can implement a card window using New Window or Go To Related Record script steps and selecting card as the window type. Only Close Window and Dim Parent Window options are available with card window type.

Please refer to the below screenshot

We can use the following script steps and Functions with cards in FileMaker WebDirect:

Script Steps

• New Window
• Adjust Window
• Move/Resize Window

Functions

• Get (WindowStyle)
• Get (WindowLeft)
• Get (WindowTop)

Things to bear in mind when using Card Window in WebDirect:

• The status toolbar and menu bar in the parent window are not active when a card window is open.
• Changes made in the card window will not be reflected in the parent window until the card window is closed.
• When the card window is closed, the parent window doesn’t always refresh. We can solve this problem by adding a Refresh Portalor Refresh Window script step to the close window button.
• When you are using the card window, make sure that close window button is visible in WebDirect solution. Because sometimes the close button may not be visible even if the close window option is selected. This can be handled by providing a custom close button on the layout.

Overall, the card window support in WebDirect offers an enriched user experience to Web users. We hope that this blog gives you valuable insights on card window support in WebDirect.

MetaSys has a team of experienced FileMaker developers. Please feel free to reach out should you need to support or you wish to develop FileMaker Apps. Please feel free to reach out to us at  https://www.metasyssoftware.com/contact

Claris FileMaker 19 introduced a new script step called “Perform JavaScript in Web Viewer,” and JavaScript function, FileMaker.PerformScript(). Using this we can use the features which are readily available in JavaScript in FileMaker.

In this blog article, we will explore the “Perform JavaScript in Web Viewer” script step. Using this new feature, we are adding the jQuery datatable in our FileMaker application.

Demonstration

In our FileMaker application, we have a list of companies and their contacts. On the company list layout we display the list, and for selected companies, we display their contacts in the jQuery datatable. Using jQuery debatable, we get all the inbuilt features available with it. For e.g. We get the sort, search functionality and pagination. We don’t have to write separate code in FileMaker !

Please see the below screenshot

Let’s take a look at how we can achieve this in FileMaker application.

• Add a web viewer on the layout and give it a name.
• Embed the JavaScript function/code as a calculation result in the Web Viewer.

The screenshot above displays a JavaScript function called “showContacts” that performs the following:

• Accept one parameter from FileMaker script.
• Format the parameter in a proper format.
• Create the datatable and pass the above parameter as data to it.

In the Web Viewer, also add all the JavaScript libraries required for datatable.

Now create the script in FileMaker with “Perform JavaScript in Web Viewer” script step. This script  will call the JavaScript function that we wrote in the web viewer. In this script, create the data in JSON format, and pass this as a parameter to the JavaScript function.  Please refer to the screenshot below.

Using this new FileMaker feature, we can work on the functionalities which are readily available in JavaScript in our FileMaker application.

If you are looking for support with FileMaker, or FileMaker integration, then feel free to contact our FileMaker certified developers. For more details, please visit –https:// www.metasyssoftware.com/filemaker

FileMaker and JavaScript Integration:

JavaScript provides a variety of libraries which can be used to create interactive dashboards, charts, maps, calendars and many more other features. This can be achieved in FileMaker also by embedding JavaScript via Web Viewer with the help of the newly introduced ‘Scripting with JavaScript in Web Viewer’ feature. This feature will allow FileMaker and JavaScript to interact with each other.

The FileMaker JavScript integration can be mainly divided into two parts:

• From a FileMaker script to JavaScript in a web viewer

The newly introduced ‘Perform JavaScript in Web Viewer‘ script step, will allow calling a JavaScript function in a Web Viewer from FileMaker script. You can also pass parameter data to this JavaScript function from FileMaker if needed.

Below example will give an idea of what can be achieved using this feature:

Now in FileMaker 19, data can be passed to the JavaScript function, which is further used to draw the given chart. In the above example, the data points, i.e. the Sales data of various brands are stored in FileMaker and then passed to the JavaScript function to generate the doughnut chart.

• From JavaScript in a web viewer to a FileMaker script

You can call a FileMaker script from a JavaScript function in the Web Viewer, using the newly introduced ‘FileMaker.PerformScript’ function. You can pass parameters to this script which is optional.

In the above example of the chart, which shows Watches Sold (brand wise), we can further leverage by calling a FileMaker script from a JavaScript function. For, e.g. clicking on a specific brand to show the sales data of that brand on a layout in FileMaker. The JavaScript function does not wait for any response from the FileMaker script. Since the script runs in the current context, it is better to set a proper context in which it should run.

Add-ons:

• Add-ons are ready to use Components or Modules, provided by Claris, which will make the developer’s life easy.
• These are commonly used Components which are generally needed by many applications. For eg.Notes, Action Items, Phone numbers.
• Add them under the Add-ons tab of Object Pane, drag them on your layout whenever needed and you are done.

• This will save your time in creating a new table, relationship, scripts, value lists which otherwise would have taken more time if you would have been adding explicitly.
• Add-ons can be uninstalled easily by right-clicking the Add-on and uninstalling it. Uninstalling an Add-on will delete it from all the layouts where it was added. Deleting related tables/fields/records is optional though.

 Card Windows via WebDirect:

• Introduction of Card Windows to FileMaker was one of the best feature released with FileMaker 16. Looking at its usability and UI capability, there was a high demand for it to be available via WebDirect.
• Card windows are now available via WebDirect.
• This will not only help FileMaker developers in quickly building Modal popup windows but will also give rich user experience to Web users.

Create new FileMaker apps in FileMaker Cloud:

This is a small but essential feature which allows developers to directly create apps on the FileMaker Cloud Server. It will save developers time .No more do you have to code locally and then upload to the cloud. Developers need to login with their Claris ID under ‘My Apps’ section of Launch centre. They can create the new app from the templates available and save it to FileMaker Cloud Server for access by other team members.

FileMaker Go and Siri shortcuts:

This new feature of Integration of FileMaker scripts with Siri shortcuts is a blessing for FileMaker Go 19 users. Many of the critical tasks can now be accomplished with a simple tap or a voice command. This feature allows donating the FileMaker scripts to Siri shortcuts.

• Your FileMaker app should have fmurlscript extended privilege enabled for FM Go user.
• The script that is needed to be assigned to a FileMaker shortcut should be enabled for shortcut donation as shown below by right-clicking on it.

• In Shortcuts app of the iOS device, create a new shortcut for running a FileMaker Script.
• Select the script to run; give a meaningful name to the Shortcut.
• You can also add this shortcut on the Home screen in case you don’t want to use voice command
• You are now ready to use the Shortcut with the voice command “Hey Siri <<Shortcut name>>”
• This will directly open the FileMaker app in FileMaker Go and execute the script.

Note: You need to have Auto Login enabled or credentials saved in the keychain.

• A FileMaker file can be disabled under ‘Manage Shortcuts Donations’ settings in FileMaker Go.

Support for NFC tags:

NFC tags are commonly used nowadays and supported by most of smartphones. NFC tags contain a small amount of information. The data stored can be a text or URL’s which uses protocols like HTTP, tel, fmp and mailto. The data can be  contact details of a person, website URL or payment related

FileMaker 19, has introduced the script step ‘Configure NFC Reading’ which allows reading NFC data and helps in storing it in FileMaker via ‘FileMaker Go’. It also supports continuous reading of the tags. In this script step, you have to pass a script which gets called when an NFC tag is scanned/read. Use Get(ScriptParameter) function in the called script to get the required data.

 FEW MORE…:

There are many other exciting features which are listed below:

• Load a Core ML model

The ‘Configure Machine Learning Model’  script step will load a given machine model. This function is used along with ‘ComputeModel’ function which provides data to a given model

• A new Icon

FileMaker 19 now has  a new classy icon along with the Application name is now changed to ‘FileMaker Pro’. If you are using Get(ApplicationVersion) function in your solution which is referring to “FileMaker Pro Advanced” based on  the old name, then don’t forget to update itto the  new name.

• Layout navigation in Layout Mode

Now when working in layout mode, you can switch to other layouts easily. Using the keyboard shortcut, opens a popup ‘Open Quickly’ box wherein you can enter the name of the layout to which you want to navigate.

• Setup a file to Open when FileMaker starts

In Edit >> Preferences, you can set a file that should open every time FileMaker start.

• Fields can now be formatted to display in Scientific notation ex. 1.2345678E+7
• Using {{PageCount}} symbol will print the number of pages on the layout.
• FileMaker 19 has three features explicitly introduced for macOS users
• Dark mode support which can be detected with the use of ‘Get ( SystemAppearance )’ function. This function was earlier ‘Get(HighContrastColor) ‘.
• Install the FileMaker Pro by dragging the installation file to the Applications folder, thus making the installation easier.
• Support for High-Efficiency Image File Format (HEIF) when using containers on macOS, iOS, iPadOS.

If you have any project to be built by using this latest FileMaker version, or to upgrade from a previous version , please feel free to contact us.