The Original FileMaker Community
Business Templates - Demo Apps - Video Tutorials -Samples - Help - 46000 Member Forum

The Leading Filemaker Developer Tools

Introduction to JavaScript in a FileMaker Web Viewer – Part 1

Has unfamiliarity kept you from using JavaScript in FileMaker? In this multi-part series, we start with a working JavaScript web page and make small incremental changes to the page source code to integrate it in the FileMaker Web Viewer, explaining each change along the way. This video is most helpful for people with little experience working with HTML or JavaScript.

We’ll modify an existing web form to achieve basic integration with minimal knowledge of JavaScript, and then refine it in upcoming videos. If you have never used JavaScript in the Web Viewer, a good place to start is working with HTML. Our new series will revisit the same project and refine our JavaScript integration with each installment.

Join us for a JavaScript ‘stepping stones’ video series that will begin with this video, using an existing web form and will conclude with new FileMaker 19 functionality.

00:00 Intro
01:09 Locating the open-source project
02:36 Viewing the project’s demo page source code
02:57 HTML source code explained
04:27 Overview of code modifications
05:28 Acquiring the project source code
06:08 Including the JavaScript project code within FileMaker
06:33 Substituting field data into web form elements
07:54 Bypassing the submit button
08:49 Exploring the web browser’s ‘Page Inspector’ tool
10:39 Using CSS to hide the web form
11:33 The bane of curly quotes in rich text editors (.rtf)
12:35 Modifying the JavaScript output

???? JavaScript Project: https://github.com/google/diff-match-patch
???? Project demo: https://neil.fraser.name/software/diff_match_patch/demos/diff.html

► PCI WEBSITE: https://www.productivecomputing.com/
► ONLINE UNIVERSITY: https://www.productivecomputinguniversity.com/
► TWITTER: https://twitter.com/prodcomp
► FACEBOOK: https://www.facebook.com/productivecomputing/
► LINKEDIN: https://www.linkedin.com/company/productive-computing-inc.            
► NEWSLETTER: http://eepurl.com/c_ZkGr

Please subscribe if you like this content or want to stay informed on more Productive Computing and FileMaker training videos.
► Auto Subscribe: https://youtube.com/c/ProductiveComputing?sub_confirmation=1

Thanks for watching!

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More

Privacy & Cookies Policy