A question was recently posted about the limitation of FileMaker’s native scripting which only allows importing single images from a mobile device’s camera app. Using a WebView and simple JavaScript, we can utilize a HTML form which can import multiple images. Those images are then converted to Base64 text and passes to a FileMaker Script which then parses them out into multiple records. This method will work in the FileMaker app, in FileMaker Go, or in WebDirect for iOS and Android users.
I started out by searching for a suitable form and existing JavaScript for the image capture. I found a lot of samples, but had issue getting JS file objects converted over to Base64. This sample was perfect as it already had code which turned the images into JSON and Base64 which would be super easy to parse in my FileMaker script.
I created a simple database to store the HTML data which the webview would render. I then added another field for the actual images. When the form is submitted, it calls FileMaker.PerformScriptWithOption and passes the JSON data. The FM script then performs some substitution on the form data so it parses properly so that it can decode the Base64 data into the container field.
You can download our sample file here. The file has a default user/pass of admin/admin.
Another option to research for multiple uploads is elemental_dropzone. Usability is similar for file browser image selection, but the JavaScript looks to be more complex.
Contact us if you’d like to discuss any of your complex FileMaker Pro needs!
6/8/2023 – Sample file updated, initial version only properly parsed PNG images, now parses JPEG files too.