Device Info Element

The Device Info Element adds a field that contains some information about the device (phone or tablet) that is submitting the COTG form. This includes the device's type (Android or iOS), operating system version, device model and its UUID. This information can be useful for both troubleshooting (if errors occur on specific device types, for example) as well as for security validation (maintaining a list of device UUIDs that are allowed access, to prevent unauthorized use even if someone has a username and password to a repository).

Device Info Element Properties:

• ID: A unique identifier for the inserted element. Used for CSS selections as well as JavaScript expressions affecting single elements.
• Class: One or more classes that can be common to more than one elements. Used for CSS selections and JavaScript expressions that can affect multiple elements.
• Label: Enter the text that is displayed adjacent to the field, indicating to the expected information from the web page visitor.
• Style: Defines how labels are added to input form elements:
  • Wrap input with label: The label is wrapped around the element, such as <label>First Name <input type="text" name="first_name"></label>
  • Attach label to input: The label is placed before the input, and refers to it: <label for="first_name">First Name</label> <input type="text" name="first_name">
  • No label: The label value is ignored.
• Insertion Point: Defines how new elements are inserted, by default:
• At cursor position: The element is inserted where the cursor is located in the template.
• Before element: The element is inserted before the current element where the cursor is located. For example if the cursor is within a paragraph, insertion occurs before the <p> tag.
• After start tag: The element is inserted within the current element, at the beginning, just after the start tag.
• Before end tag: The element is inserted within the current element, at the end, just before the end tag.
• After element: The element is inserted after the current element where the cursor is located. For example if the cursor is within a paragraph, insertion occurs after the <p> tag.
• Elements: Use the drop-down to select which element is used for the insertion location. The list displays every element in the breadcrumbs, from the current selection point until the root of the body.