Messing with Web Viewer

Discussion created by first_on_colour on Dec 18, 2018
Latest reply on Dec 18, 2018 by Mike Duncan

Part 1: The HTML Document


When creating an HTML document in Web Viewer, you must keep in mind that it needs to be a Data URI, This allows the web viewer to render the page without connecting to the internet.



"data:text/html,<!DOCTYPE html>
<html><head><meta charset=\"utf-8\"><title></title></head>
<body><h1>Hello World!</h1></body></html>"


Part 2: Adding Javascript


Using the above example we can add values from Filemaker, in my example I'm going to be using a comma delimited string


Example: Local Javascript

"data:text/html,<!DOCTYPE html>
<html><head><meta charset=\"utf-8\"><title></title>
function main() {
     var elem = document.createElement('p');
     elem.appendChild(document.createTextNode('" & Test::file_maker_field & "'));
if (window.requestAnimationFrame) {
     window.requestAnimationFrame(function() {
          window.setTimeout(main, 0);
} else {
     window.addEventListener('load', main);
<body><h1>Hello World!</h1></body></html>"


Now when you edit the field, a new element will show on the "web page".


I hope this helps some of you, I had a hard time finding something that explained this to me when I learned Filemaker so I thought I would share my experience.

If you have any questions please do ask!