/
Integrating TinyMCE Editor

Integrating TinyMCE Editor

Owned by David Russo
Last updated: Aug 16, 2023 by Jessica Tomkins
2 min read



TinyMCE is a popular open source text editor for web browsers, useful for comments, notes, or any other free-form text entry:Ā 

Like many JavaScript-based components, TinyMCE can be integrated into Profound UI screens. The example below shows how to create a TinyMCE editor over a Profound UI text area widget which can be processed using standard RPG field binding. More information can be found on the TinyMCE website:Ā 

http://www.tinymce.com

To use the example:Ā 

  • Download a copy of TinyMCE ZIP archive from the download siteĀ here.Ā Extract the 'tinymce' directory and place in HTTP server document root directory (default /www/profoundui/htdocs) on the IFS. This example was tested with TinyMCE version 4.1.7.

  • Download the example save fileĀ here.Ā Transfer to your system and restore the TINYMCE library. This contains the Rich Display File and RPG source code.

  • Download the example scriptĀ here.Ā Place this in your HTTP server DOCUMENT_ROOT/profoundui/userdata/custom directory, or any sub-directory. This file contains calls that are used in the Rich Display File source member TINYMCED. See the "onload" and "onsubmit" events:

  • The 'createEditor()' function call accepts the id of the text area widget.Ā 

  • Call the CL program TINYMCE/TINYMCEC to start the example. This can be called from an anonymous or authenticated Rich Display File application session, or from Genie.Ā 

  • The example program saves the editor output into a database file TINYMCE/TINYMCEP. The text is stored in Unicode (UTF-16), to support all possible characters.

  • The same "onload" and "onsubmit" calls can be used to integrate a TinyMCE editor into any Rich Display File screen.