Advanced programming with Javascript

A 4D View Pro Area is a Web Area form object that uses the embedded web rendering engine. As such, it behaves just like any other web area, and you can get it to execute Javascript code by calling the WA Evaluate Javascript 4D command.

Since 4D View Pro is powered by the SpreadJS spreadsheet solution, you can also call SpreadJS Javascript methods in 4D View Pro areas.

Hands-on example: Hiding the Ribbon

Since 4D View Pro is a web area, you can select a webpage element and modify its behavior using Javascript. The following example hides the spreadJS Ribbon:

//Button's object method

var $js; $answer : Text

$js:="document.getElementsByClassName('ribbon')[0].setAttribute('style','display: none');"

$js+="window.dispatchEvent(new Event('resize'));"

$answer:=WA Evaluate JavaScript(*; "ViewProArea"; $js)

Calling SpreadJS Javascript methods

You can tap into the SpreadJS library of Javascript methods and call them directly to control your spreadsheets.

4D has a built-in Utils.spread property that gives access to the spreadsheet document (also called workbook) inside the 4D View Pro area, making it simpler to call the SpreadJS Workbook methods.

Example

The following code undoes the last action in the spreadsheet:

WA Evaluate JavaScript(*; "ViewProArea"; "Utils.spread.undoManager().undo()")

4D View Pro Tips repository

4D-View-Pro-Tips is a GitHub repository that contains a project full of useful functions, allowing to manage floating pictures, sort columns or rows, create a custom culture, and much more! Feel free to clone it and experiment with the project.