With the introduction of the FileMaker 18 platform comes new barcode types now supported by FileMaker Go 18. These add to the list of stypes natively supported by iOS, and FileMaker Go has been updated to leverage support from iOS as well. The newly available barcode types are:
- PDF417
- ITF-14
- Aztec
- Data Matrix
These are in addition to the already supported list of barcode types, which are as follows:
- Code 39
- Code 93
- Code 128
- EAN-8
- EAN-13
- EAN/UPC Composite
- GS1 2-Digit Add-On
- GS1 5-Digit Add-On
- GS1 DataBar Expanded
- GS1 DataBar (RSS)
- ITF-14
- ISBN-10 (from EAN-13)
- ISBN-13 (from EAN-13)
- QR Code
- UPC-A
- UPC-E.
- Codabar (added in 13.0v6)
Read and Write Barcodes
Since we can read these barcode types, that begs the question, how to generate any one of the supported barcodes? Ideally, we want to generate one of the supported barcodes that we can print out and scan them back in with a supported iOS device running FileMaker Go. That would provide an end-to-end solution using the FileMaker Platform.
There are several solutions to generate a barcode, and each has its own merits depending on your needs. Most of these require the use of a font installed in the OS or a FileMaker Plugin. At Soliant Consulting, we like to generate barcodes using JavaScript, which is capable of dynamically generating an image suitable to store in a FileMaker container field and also prints nicely. Doing so does not require a web viewer to display the resulting image. However, you can use a web viewer generate the image via the javascript engine invoked when loading the HTML. You also need not save the image beyond the time needed to print it. That can save space required by your solution.
We’ve udpated the js_Barcode.fmp12 example to generate the newly added PDF417 barcode type. You can use that in your solutions.
Get the Sample File
You can get a copy of the sample file used to generate barcodes with JavaScript here.
HTML 5 Canvas Objects
Interestingly, this added example also demonstrates how to return any rendered HTML from a “canvas” object. If you are familiar with HTML 5, a canvas object (a special type of HTML element) draws graphics on the fly in a web page. This also includes JavaScript support for accessing the resulting image with something like “canvas.toDataURL();” where the result will be the base64 encoded contents of the image, as PNG by default. Once we have the content, we can hand it back to FileMaker and convert the contents to an image by decoding the base64.
Other JavaScript libraries support a wide range of barcode types, one of which is listed in the references below. You may already have a barcode requirement or want to evaluate your options. Whatever the case, you have options for both generating and reading the barcode types you require with FileMaker.
References
- Bar code scanning with FileMaker Go – FileMaker Support
- FileMaker 18 Insert from Device – FileMaker Help
- JsBarcode – GitHub
- Barcode Writer in Pure JavaScript – GitHub
Mike, very nice! Does you sample file generate QR Codes?
The sample file does not, but there are other javascript libraries that can do this.
hi cant you do for QDR code and update your file ?
For a QR code, I would use a web service to return an image. I haven’t found a javascript lib that was easy to implement with FM, but simply doing an insert from URL to a web service, even one you can create, is easier.
Can you create Barcodes from an iOS device using this sample file?. I can create barcodes on FMP Adv without issue but if I put the sample file on an iOS device (FMGo 18) the generate barcode script does not return a barcode image.
I realized what the issue was. The web viewer used in the scripting cannot be offscreen on FMGo. Move the webviewer object on screen resolved the issue.
Nice
Hi,
When i’m trying to execute the scripts “Generate Barcode” and “SavePNG” right after the other in one script, then it doesn’t work. The webviewer does not receive the barcode and thus does not generate one as PNG. If i assign those scripts to buttons and launch first and then the second one, it works.
How can i refresh webviewer, or omit it completely?
I have not replicated this, but would expect you need to pause in order for the webviewer to load. It should be possible to pause and continue based on the callback in javascript.
I have been successful in getting the PDF417 scripts to work in my solution as a stand alone script. But when it embed it as a subscript in another script it does execute the URL containing to SavePDF script. This does work for me but not for my Client at all. I’m working outside their network and they are inside their network. Is there some thing that would prevent it from working in this method?
There should not be any network dependencies, but do you know what version of FMP and the OS that the client is using? For FMP 19, there is the option of upgrading to use the newly introduced javascript functions that should be more reliable.
I have downloaded and integrated the new version. It is still not working. Now I’m getting an error on the Perform JavaScript in Web Viewer script set. “Command is invalid (for example, a Set Field script step does not have a calculation specified.” when stepping through data viewer. I can get it to work on your sample file on the the current record you have in the database, but if I create a new record I get the same error. What am I missing?
Very odd. I get the same but only for new records. I placed the webviewer on the layout and the issue went away. I have updated my sample with that adjustment. You can make the webviewer very small and transparent so it is not noticed. Try that?
I had already done that, I even copied your web viewer from the sample file and pasted it on my layout and I’m getting the same error.
What OS and FM version are you working with?
Fm 19.2.2.234, Mac OS 10.15.5