2018.1

Table Of Contents
All COTG elements have a role attribute. This attribute is not supposed to be edited:without
the correct role attribute, the element won't function.
As noted, the name attribute is what identifies the element after submitting the form.
Tip
Use the Outline pane at the left to see which elements are present in the template and to
select an element.
Use the Attributes pane at the right to see the current element's ID, class and some other
properties.
Use the Styles pane next to the Attributes pane to see which styles are applied to the
currently selected element.
Tip
Click the Edges button on the toolbar to make borders of elements visible on the Design
tab. The borders will not be visible on the Preview tab.
How to make COTG elements required
To make a COTG element required, or to change the validation of a COTG Form, right-click the
element and choose Validation settings. Set the Form's validation method to jQuery and set
the requirements and a message per field. For an explanation see "Changing a Form's
validation method" on page593.
Changing widget settings in HTML
The Camera and Geolocation widgets have configurable options; you can decide which
buttons will be visible in the Camera element, for example. A number of these options can be
set via the user interface (see "Element specific settings" on the previous page).
The settings are stored in JSON format in the data-params attribute of the element in the
HTML, as you can see on the Source tab in the Designer after making a setting.
All options, including options that cannot be set via the user interface, can be set via this data-
params attribute. To define a timeout of 6 seconds for a Geolocation element, for example, you
could switch to the Source tab and change its HTML to:
<div id="geolocation1" role="cotg.Geolocation" data-params="
Page 489