# UICONSTANTS

## Overview

The `UICONSTANTS` object provides predefined script constants to configure various aspects of the user interface. These constants enable developers to control application behavior, including component-specific properties, tooltip timings, and table view settings.

For instance:

* `CALENDAR_NG_SHOW_ISO_WEEK_NUMBER` allows toggling the display of ISO week numbers in calendar components.
* `COMBOBOX_ENABLE_FILTER` controls the visibility of search boxes in combobox fields.
* `HTML_EDITOR_CONFIGURATION` supports custom configurations for TinyMCE editors in editable HTML areas.
* `TABLEVIEW_NG_PAGE_SIZE_FACTOR` adjusts data-loading size for table views in NGClient, enhancing performance for large datasets.
* `TRUST_DATA_AS_HTML` determines whether displayed data is sanitized, a feature that should be used cautiously to avoid potential XSS vulnerabilities.

These constants are typically configured using methods like `application.putClientProperty` or `element.putClientProperty`, allowing for application-wide or component-specific behavior modifications. Many of these configurations, such as `TOOLTIP_INITIAL_DELAY` or `TYPE_AHEAD_SHOW_POPUP_ON_FOCUS_GAIN`, contribute to a more user-friendly interface.

## Constants Summarized

| Type                                                                         | Name                                                                               | Summary                                                                                     |
| ---------------------------------------------------------------------------- | ---------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------- |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [COMBOBOX\_SHOW\_POPUP\_ON\_FOCUS\_GAIN](#combobox_show_popup_on_focus_gain)       | Property that can be set using application.                                                 |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [DEFAULT\_FORM\_USE\_MIN\_HEIGHT](#default_form_use_min_height)                    | Sets the default value (true/false) that should be used when showing a form in a container. |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [DEFAULT\_FORM\_USE\_MIN\_WIDTH](#default_form_use_min_width)                      | Sets the default value (true/false) that should be used when showing a form in a container. |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [FORMAT\_DECIMAL\_SYMBOL](#format_decimal_symbol)                                  | Property that can be set using application.                                                 |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [FORMAT\_GROUPING\_SYMBOL](#format_grouping_symbol)                                | Property that can be set using application.                                                 |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [HTML\_EDITOR\_CONFIGURATION](#html_editor_configuration)                          | Property that can be set on editable html area using element.                               |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [LEAVE\_FIELDS\_READONLY\_IN\_FIND\_MODE](#leave_fields_readonly_in_find_mode)     | Property that can be set using application.                                                 |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [LISTFORMCOMPONENT\_PAGING\_MODE](#listformcomponent_paging_mode)                  | Property that can be set using application.                                                 |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [NG\_BLOCK\_DUPLICATE\_EVENTS](#ng_block_duplicate_events)                         | Property that can be set using application.                                                 |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [RELATED\_NULL\_SEARCH\_ADD\_PK\_CONDITION](#related_null_search_add_pk_condition) | Property that can be set using application.                                                 |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [TOOLTIP\_DISMISS\_DELAY](#tooltip_dismiss_delay)                                  | Property that can be set using application.                                                 |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [TOOLTIP\_INITIAL\_DELAY](#tooltip_initial_delay)                                  | Property that can be set using application.                                                 |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [TRUST\_DATA\_AS\_HTML](#trust_data_as_html)                                       | Property that can be set using element.                                                     |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [TYPE\_AHEAD\_SHOW\_POPUP\_ON\_FOCUS\_GAIN](#type_ahead_show_popup_on_focus_gain)  | Property that can be set using application.                                                 |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [VALUELIST\_MAX\_ROWS](#valuelist_max_rows)                                        | Property that can be set using application.                                                 |

## Constants Detailed

### COMBOBOX\_SHOW\_POPUP\_ON\_FOCUS\_GAIN

```
Property that can be set using application.putClientProperty() or element.putClientProperty(). It is used only in Titanium Client.

If set on application it will affect all COMBOBOX fields. If set on an element it will affect only that COMBOBOX element/field (with priority over the application property).
Value can be true/false/null.

If set to true, the affected COMBOBOX will show the pop-up when gaining focus (either from user input or API).
DEFAULT:  false for Titanium Client (to be more compatible with NGClient).
```

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
// make all COMBOBOX fields not show the pop-up when gaining focus
application.putClientProperty(UICONSTANTS.COMBOBOX_SHOW_POPUP_ON_FOCUS_GAIN, false);
// make one COMBOBOX field show the pop-up when gaining focus - overrides the application property set
forms.someForm.elements.comboboxElement.putClientProperty(UICONSTANTS.COMBOBOX_SHOW_POPUP_ON_FOCUS_GAIN, true);
```

### DEFAULT\_FORM\_USE\_MIN\_HEIGHT

Sets the default value (true/false) that should be used when showing a form in a container.\
Default this is true when the forms useMinHeight property is unset,\
that means the css minHeight is set for this form at runtime.

You can set the default value to false for all forms that don't have that property set,\
so that no minHeigth is generated for those forms.

The value can be true/false\
DEFAULT: true

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
application.putClientProperty(UICONSTANTS.DEFAULT_FORM_USE_MIN_HEIGHT, false)
```

### DEFAULT\_FORM\_USE\_MIN\_WIDTH

Sets the default value (true/false) that should be used when showing a form in a container.\
Default this is true when the forms useMinWidth property is unset,\
that means the css minWidth is set for this form at runtime.

You can set the default value to false for all forms that don't have that property set,\
so that no minWidth is generated for those forms.

The value can be true/false\
DEFAULT: true

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
application.putClientProperty(UICONSTANTS.DEFAULT_FORM_USE_MIN_WIDTH, false)
```

### FORMAT\_DECIMAL\_SYMBOL

Property that can be set using application.putClientProperty(), preferably in solution onOpen handler (or before showing the ui components that formats numbers).

If set this will be used as the grouping symbol for all number formatted fields that uses the default servoy formatting services (so 3rd party components that they there own formatting could/will ignore this)

The value can be any kind of character (string)

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
application.putClientProperty(UICONSTANTS.FORMAT_DECIMAL_SYMBOL, ';'); // make the grouping symbol a semicolon
```

### FORMAT\_GROUPING\_SYMBOL

Property that can be set using application.putClientProperty(), preferably in solution onOpen handler (or before showing the ui components that formats numbers).

If set this will be used as the grouping symbol for all number formatted fields that uses the default servoy formatting services (so 3rd party components that they there own formatting could/will ignore this)

The value can be any kind of character (string)

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
application.putClientProperty(UICONSTANTS.FORMAT_GROUPING_SYMBOL, ' '); // make the grouping symbol a space
```

### HTML\_EDITOR\_CONFIGURATION

Property that can be set on editable html area using element.putClientProperty()

The value must be a valid json string according to TinyMCE editor configuration (<http://www.tinymce.com/wiki.php/configuration).\\>
It will be used to override/set configuration properties in order to customize the editor.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
// adding a new TinyMCE plugin (same for skin or theme)
// this code assumes plugin.min.js was copied in web server at specified path
// NOTE: we use external plugin, not plugin, in order for file to be accessible from web server; for this example, pluging.min.js file must be copied under ServoyInstall/application_server/server/webapps/ROOT/tinymce/plugins/link
element.putClientProperty(UICONSTANTS.HTML_EDITOR_CONFIGURATION, '{"external_plugins": { "link": "../../../tinymce/plugins/link/plugin.min.js"}}')

// change the editor configuration (add menubar, status bar and change toolbar)
element.putClientProperty(UICONSTANTS.HTML_EDITOR_CONFIGURATION, '{"menubar": "tools table format view insert edit", "statusbar" : true, "toolbar": "undo redo | styleselect | bold italic"}')
```

### LEAVE\_FIELDS\_READONLY\_IN\_FIND\_MODE

Property that can be set using application.putClientProperty().

If set to true, fields that are read-only won't be editable in find mode\
If set to false, fields that are read-only will be editable in find mode

The value can be true/false\
DEFAULT: false

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
application.putClientProperty(UICONSTANTS.LEAVE_FIELDS_READONLY_IN_FIND_MODE, true)
```

### LISTFORMCOMPONENT\_PAGING\_MODE

Property that can be set using application.putClientProperty(). This property only works in Titanium.\
Property should be set onSolutionOpen or onLoad of the form (before form is shown in client).\
If set to true, the listformcomponent will use the old paging mode for display.

The value can be true/false\
DEFAULT: false

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
application.putClientProperty(UICONSTANTS.LISTFORMCOMPONENT_PAGING_MODE, true)
```

### NG\_BLOCK\_DUPLICATE\_EVENTS

Property that can be set using application.putClientProperty() or element.putClientProperty()..

If set to true, any events of same type and on same component will be blocked (cancelled) until first event is finished.

The value can be true/false\
DEFAULT: false

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
application.putClientProperty(UICONSTANTS.NG_BLOCK_DUPLICATE_EVENTS, true)
```

### RELATED\_NULL\_SEARCH\_ADD\_PK\_CONDITION

Property that can be set using application.putClientProperty(), this has no meaning on an component If set to true, related find/search will only return records that have a related match, also in case of left outer joins. Otherwise a related search on a field may return records where the related search does not match. For example, \*

```js
    if (foundset.find()) {
     foundset.myleftouterjoinrelation.myfield = 'someval';
     foundset.search();
    }
```

With this setting to false records of the foundset table that have no related records via the relation will also be returned. The value can be true/false DEFAULT: servoy property servoy.client.relatedNullSearchAddPkCondition/true

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
application.putClientProperty(UICONSTANTS.RELATED_NULL_SEARCH_ADD_PK_CONDITION, false)
```

### TOOLTIP\_DISMISS\_DELAY

Property that can be set using application.putClientProperty() and indicates the delay in milliseconds after the tooltip is dismissed.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
application.putClientProperty(UICONSTANTS.TOOLTIP_DISMISS_DELAY, 4000)
```

### TOOLTIP\_INITIAL\_DELAY

Property that can be set using application.putClientProperty() and indicates the delay in milliseconds before the tooltip is shown.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
application.putClientProperty(UICONSTANTS.TOOLTIP_INITIAL_DELAY, 2000)
```

### TRUST\_DATA\_AS\_HTML

Property that can be set using element.putClientProperty() or application.putClientProperty() If set to true, data showed on elements like buttons or labels will not be sanitized. Showing unsanitized data can make the system vulnerable to XSS attacks, for example, an user registers with name 'John Doe\<script>someEvilJavascript\</script>', when this data is shown in a label (by another user) the javascript in the script tags will be executed. Only enable this setting if the data shown can always be trusted and is never composed of data from an external system or user. The value can be true/false DEFAULT: false

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
element.putClientProperty(UICONSTANTS.TRUST_DATA_AS_HTML, true)
```

### TYPE\_AHEAD\_SHOW\_POPUP\_ON\_FOCUS\_GAIN

Property that can be set using application.putClientProperty() or element.putClientProperty().

If set on application it will affect all default/legacy TYPE-AHEAD fields. If set on an element it will affect only that default/legacy TYPE-AHEAD element/field\
(with priority over the application property).\
Value can be true/false/null.

If set to true, the affected TYPE\_AHEAD(s) will show the pop-up when gaining focus.\
DEFAULT: true.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
// make all TYPE-AHEAD fields not show the pop-up when gaining focus
application.putClientProperty(UICONSTANTS.TYPE_AHEAD_SHOW_POPUP_ON_FOCUS_GAIN, false);
// make one TYPE-AHEAD field show the pop-up when gaining focus - overrides the application property set
forms.someForm.elements.typeAheadElement.putClientProperty(UICONSTANTS.TYPE_AHEAD_SHOW_POPUP_ON_FOCUS_GAIN, true);
```

### VALUELIST\_MAX\_ROWS

Property that can be set using application.putClientProperty()

The value can be a positive integer representing the maximum number of rows that will be retrieved by query in database or related valuelist.\
Can have a maximum value of 1000.

DEFAULT: 500

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
application.putClientProperty(UICONSTANTS.VALUELIST_MAX_ROWS, 1000)
```

***
