2022.1

$('#date1').trigger("show-date-picker.cotg", new Date("2018-01-
01"));
});
});
Dynamically adding COTG widgets
Capture OnTheGo (COTG) widgets can be added to a Form dynamically, via jQuery. For
example: a new Camera element could be added when the user clicks an Add button. This
topic explains how to implement this. It is assumed that you have a basic understanding of
HTML forms, CSS, JavaScript, and jQuery.
Prerequisites
Before you can start writing code that adds a widget in response to an action of the user, you
need the following:
l Some element on the Form to trigger the creation of the widget. This could be anything
that responds to an action of the user; a button or link, for example. Make sure that this
element has an ID.
l A Form element to which the new widget can be added; a <div> for example. Again, make
sure to give this element an ID.
l The HTML structure and attributes of the widget, so that you can recreate it in code. The
HTML structure of a widget can be seen on the Source tab after inserting the same kind of
widget into a Form in the Designer.
Also, if you don't have a JavaScript file for your code yet, add one to the resources of your
template (see "Adding JavaScript files to the Resources" on page598) and make sure to
include that file in the Web context or in the Web section that contains the COTG Form (see
"Including a JavaScript file in a Web context" on page600).
Adding an event handler
First of all you need to write an event handler that responds to the event that is meant to trigger
the creation of the widget (e.g. the onClick event of a button or link), by calling the function that
creates the widget. The event handler has to be added on the $(document).ready() function,
which is fired when the Form is loaded in the browser/app.
$(document).ready(function() {
$('#add-element').on('click', function() {
//call the function that creates the widget
Page 642