UI Extension Fields

The Name field is used to enter a short name for the UI extension.

The Title field is used to enter the text that is to be displayed as the section header above the UI extension when the UI extension is presented within a form.

The Category field is used to select the type of record in which the UI extension can be selected.

The Disabled box is checked when the UI extension may no longer be related to other records.

The Version field is used to select a version of the UI extension. If a version has not yet been activated, it is labeled “Being Prepared”. The version that is currently active can be selected using the “Active” option. Previously activated versions are identified by the date and time at which they were activated.

The HTML field on the HTML tab is used to maintain the HTML code of the UI extension.

The maintenance of code in this field is supported by a code editor that offers special shortcut keys.

The JavaScript field on the JavaScript tab is used to maintain the JavaScript code of the UI extension.

The maintenance of code in this field is supported by a code editor that offers special shortcut keys.

The CSS field on the CSS tab is used to maintain the CSS code of the UI extension.

The maintenance of code in this field is supported by a code editor that offers special shortcut keys.

The Field field of the Snippets section on the HTML tab is used to add fields to the UI extension. When the Append Snippet button is pressed, the HTML code for the field is inserted below the HTML code that already existed in the HTML field. The appended HTML code is highlighted to make it easier to identify the code that has been added.

The following types of fields can be added in the Snippets section:

• attachment – An attachment field allows a file to be linked to the record.
• checkbox – A checkbox is a single option that can be checked or unchecked.
• custom-suggest – A custom-suggest field is a suggest field based on a custom collection for which a custom view has been made. This option is only available when at least one enabled custom view with record type ‘Custom Collection Elements’ exists.
• date-time – A date and/or time field is used to specify a date and/or time.
• location – A map is used to specify a location. The Google Maps app must be installed from the app store.
• number – A number field is used to enter numerical values.
• organization-suggest – An organization-suggest field allows a user to select any organization that they have access to.
• person-suggest – A person-suggest field allows a user from an internal organization to select any person who is registered in his/her 4me account or in any of its support domain accounts. A user from an external organization can only use a Person field to select a person of that external organization.
• secret – Available for app offerings. When a secret field is filled out by the customer, a webhook message will be sent to the integration engine using the app_instance.secrets-update webhook. More information in the Developer Documentation.
• section – A section is used to place a header above a group of fields.
• select – A select field offers a list of predefined options, from which only one can be selected.
• site-suggest – A site-suggest field allows a user to select any site that they have access to.
• team-suggest – A team-suggest field allows specialists to select any team that they have access to.
• text – A text field is used to enter text.

The Label field of the Snippets section on the HTML tab is used to add a label to the field on the user interface.

The ID field of the Snippets section on the HTML tab is used to create a unique HTML ID.

The Options of the Snippets section can add optional attributes to the field. The following options are available, depending on the selected combination of Category and Field:

• add to subject – appends the value of this field to the subject of the request, problem or workflow.
• checked (only for checkbox) – adds a default checkmark in the checkbox.
• filterable – makes the field filterable.
• hidden – creates a field that is only accessible to automation rules and APIs.
• visible only to specialists, auditors, and account administrators of this account – the field is only visible to specialists, auditors, and administrators of the account in which the UI extension was created, and to specialists, auditors, and administrators of a support domain account that belongs to the same directory account as the account in which the UI extension was created.
• multiline (only for text) – multiline text is accepted.
• multiple values – more than one value can be added, or multiple attachments may be uploaded.
• required – the UI extension field is required.
• rich text (only for text) – text formatting and images can be entered in this field.
• searchable – field values can be found by using the search bar .
• show when empty – shows the field even when no value was entered.

The Type field of the Snippets section on the JavaScript tab is used to add JavaScript code to the UI extension. When the Append Snippet button is pressed, the JavaScript code is inserted below the JavaScript code that already existed in the JavaScript field. The appended JavaScript code is highlighted to make it easier to identify the code that has been added.

The following types of JavaScript snippets can be added in the Snippets section:

• asset required – The asset required option is used to add JavaScript code that ensures that the Asset field is required in Self Service when an end user is submitting a new request.
• attachment required – The attachment required option is used to add JavaScript code that ensures that the ‘Attach file…’ link is required for new requests or newly assigned tasks.
• note required – The note required option is used to add JavaScript code that ensures that the Note field is required in Self Service when an end user is submitting a new request.

The CSS tab also has a Type field. There it is used to add CSS code to the UI extension. When the Append Snippet button is pressed, the CSS code is inserted below the CSS code that already existed in the CSS field. The appended CSS code is highlighted to make it easier to identify the code that has been added.

The following types of CSS snippets can be added in the Snippets section:

• field layout – The field layout option is used to add CSS code that will present the UI extension with less padding between each field. This can be useful when the UI extension is made up of a lot of fields.
• hide elements – The hide elements option is used to add CSS code for hiding the default Subject and Note fields in the Self Service user interface. This option is also used to hide the Attachment hyperlink that is normally visible below the Note field in Self Service.

The Phrases field below the HTML field lists all texts of the UI extension that are available for translation in the Translations section of the Settings console.