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

FileMaker integration is made easy due to two powerful features. Firstly, the enhanced cURL options which make it easy to interact with many systems by facilitating many common file transfer options. Secondly, the native functions to create and extract data from JSON, which makes interactions with web services easy. These features allow FileMaker to be integrated with almost any third party products that provide the APIs for communication, including Shopify.

Step One: Create a private app in the Shopify account.

• We can connect to a Shopify account by creating a private app. Shopify requires an API Key, the API password of the private app, and the store name for authentication.
• The screenshot below shows how to create a Private app and how to get the API key and API password.

• Give the appropriate API permissions required by your private app.
• As described in the Shopify documentation, Shopify authenticates private applications using the following URL format: https://{apikey}:{password}@{hostname}/admin/api/{version}/{resource}.json

Note that the ‘hostname’ refers to the store name, and ‘version’ refers to the API version in use.

Step Two: Store the required Shopify details in FileMaker

• In the FileMaker database, create the fields to store the API Key, API Password, Store Name and API Version, as shown in the screenshot below.

Step Three: Write the script

• Write a script in FileMaker which will create the product in the Shopify account using the Shopify details mentioned in Step 2. For this step, we will use the cURL and JSON features of FileMaker.
• In the script, first create the JSON array with Product details such as Product Title, Product Description, Vendor etc.
• Next, format the URL (using the URL format mentioned in Step 1) with your Shopify account details. Then use this URL in the FileMaker ‘Insert from URL’ script step and pass the JSON array using the cURL option in it.
• Please see the below screenshot for reference.

After these three steps, we are ready to publish our product from a FileMaker database to a Shopify account. If you are experiencing issues with FileMaker, or FileMaker integration, feel free to contact our FileMaker certified developers. For more details, please visit – https://www.metasyssoftware.com/filemaker