2022.1

Adding event listeners
In the process of closing and opening a Form two important events are triggered by the COTG
library:
l olcotgsavestate. This event is meant for custom scripts to save information when the
user closes or submits the Form. It occurs after the state of all static input fields has been
saved.
l olcotgrestorestate. This event allows custom scripts to do something when the Form is
reopened. It occurs after all static inputs have been restored.
To latch on to these events, you have to register a olcotgsavestate listener and a
olcotgrestorestate listener, respectively, on the window object. The window object represents a
window containing a DOM (document object model), in this case the COTG Form.
The function callback on its addEventListener method allows you to implement custom code as
part of the save and restore processes.
(For more information about the addEventListener method see the documentation: Mozilla and
w3schools.)
The following code registers the olcotgsavestate listener on the window object.
window.addEventListener('olcotgsavestate', function(event) {
/* code to save custom data */
});
The following snippet does the same for the restore process.
window.addEventListener('olcotgrestorestate', function(event) {
/* code to retrieve custom data and restore custom widgets */
});
The following code combines the previously saved string with the restored URL of a (static)
COTG Camera element:
window.addEventListener("olcotgrestorestate", function(event) {
var value = event.detail.state["myString"];
value = value + $("#camera1 img").attr("src");
$("form p").html(value);
};
Page 646