Todd tried to solve the many problems by creating the FM WebViewer Bridge, a library to pass data back and forth to the web viewer’s code. It worked mostly very well. Many of our products relied on the Bridge, and I taught a training session at FileMaker DevCon 2019 where we spent at least 3 hours working with the Bridge. It worked. Mostly. (WebDirect, I’m still looking at you!)
But now, in Claris FileMaker 19, we no longer have to use the FM WebViewer Bridge. If you’ve ever used it, you can throw it away! Stop using it. This ‘escape hatch’ (as Todd calls these things) is no longer necessary; we have in FileMaker 19 all we need to solve most of the web viewer problems. The new functions provides so much more flexibility and functionality that the Bridge ever could achieve. (This fact, of course, is because Claris built a bridge-like component into FileMaker itself). And if you’ve never used the FM WebViewer Bridge, don’t. Don’t try to learn it. Just forget about it.
Full disclosure: Todd has always advocated for tossing out the Bridge once this functionality arrived and you’re using FileMaker 19; I’m not being insubordinate.
Of course, if you’re still working in FileMaker 16-18 you have to use the FM WebViewer Bridge. If you care about WebDirect, however, FileMaker 19 and the new functions are a must.
Communicating Better with JS Libraries
Let me give you a brief description and use of each, but also let me say that Todd and I will be hosting some coding parties and Office Hours once in awhile to demonstrate working with this new bag of functionality in the upcoming weeks. Stay tuned. If you want to work with these functions, we’ll show you how and give you our insights into their use. We’ve spent the last nine months wrestling with the script step and the JS function, so we have lots of insight about how to use these.
Back to the brief description. I’ll include an example I’m working on. Here’s the end result:
It’s it beautiful?
This sliders add-on (or it will be an add-on) was meant to take a found set of records and render them as such. Each question could contain the actual question, a set value, and a disabled option. The way I built this could handle any number of questions and, eventually, different range scales for each question. There’s a lot of possibilitiy.
NOTE: This is a bit of a complex example, but the principles that I illustrate will apply to simple and to complex ones. I’ll include a simple example on this post.
The script that runs this starts by first collecting the questions from the table, collecting the configuration of the sliders (as in the colors, range, etc). The script then loads the JS code from a field into the web viewer.
The Functions Themselves
Object Name: the name of the web viewer object on the layout. This is an important parameter (other than being required). You could have on a layout multiple web viewers, and you could have multiple scripts that update each one. So name your web viewer and provide the name here.
setInitialFMProps()–, and I’m passing to the function a JSON object in the
Inside my JS, I’ve got a callback function to FileMaker. It looks like this:
You can see
window.FileMaker.PerformScript("ChangeData",obj) is the function.
The ‘window’ part of the function is something I added. I wanted to make sure this function was available globally.
The “ChangeData” is the name of the script. Here Case doesn’t matter; FileMaker can find a script called “Changedata” or “ChangeData” or “changedata”.
And finally, I’m passing back to FileMaker the value of the
obj JS variable.
But if you’re already familiar with working with JS and web viewers, here are some considerations:
window.to put it in the global space.
- All of this works on WebDirect by the way (WebDirect, I forgive you!).
- There is an issue with refreshing the web viewer on WebDirect. We’ll provide more detail in other posts.
So give it a try. . .