first_on_colour

Messing with Web Viewer

Discussion created by first_on_colour on Dec 18, 2018

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.

 

Example:

"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>
<script>
function main() {
     var elem = document.createElement('p');
     elem.appendChild(document.createTextNode('" & Test::file_maker_field & "'));
     document.body.appendChild(elem);
}
if (window.requestAnimationFrame) {
     window.requestAnimationFrame(function() {
          window.setTimeout(main, 0);
     }
} else {
     window.addEventListener('load', main);
}
</script>
</head>
<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!

Outcomes