MultiSelectElementFactory

MultiSelectElementFactory - Factory for creating custom multiple select elements Converts into a custom DIV-based UI with: - Custom trigger showing selected items (max 2, then "+n items") - DropdownPanel for options list with check/uncheck icons

Generated from source on 2026-08-21. Descriptions come from JSDoc in the file.
Re-run docs_scaffold when the code changes; hand edits are lost on regeneration

Source

• File: Now/js/MultiSelectElementFactory.js (920 lines)
• Form: ES class

Public methods (19)

static addValue(element, value, text)

Select one option by value. Comparison is loose so a numeric value from an API still matches the string value carried by the option element.

static cleanup(instance)

Tear the control down and run the teardown closure stored on the instance.

static clearSelection(instance)

Deselect everything.

static create(def)

Build a <select multiple> from a field definition. An id is generated when the definition does not supply one, so the trigger and dropdown have something stable to point at.

static createOptionsList(instance)

Rebuild the dropdown rows from the select's options. The dropdown is emptied first, so this is safe to call whenever the option set changes.

static customValidateValue(value)

Validate the selection for a required field. Required is taken from the element's required attribute or data-required="true".

static getSelectedValues(element)

The currently selected values. Read from the underlying select rather than the custom UI, so it stays correct even when the value was changed programmatically.

static populateFromOptions(element, optionsData, optionsKey)

Populate select element from provided options object Used when options are provided by modal response or parent context

static populateFromOptionsInContainer(container, optionsData)

Populate all select elements with data-options-key attribute from provided options object

static removeValue(element, value)

Deselect one option by value. Comparison is loose, matching addValue.

static retranslate(instance)

Re-translate the visible labels after a locale change.

static setSelectedValues(element, values)

Replace the selection with a given list of values. Values are compared as strings, so a list of numbers still matches options whose values are strings.

static setupDropdownKeyboardNavigation(instance)

Bind arrow-key navigation inside the open dropdown. Guarded by an internal flag so reopening the dropdown does not stack duplicate key handlers.

static setupElement(instance)

Replace a <select multiple> with the custom trigger and dropdown. Anything that is not a multiple select is refused and reported to the console, since the rest of this factory reads selectedOptions.

static setupEventHandlers(instance)

Bind the trigger click that opens and closes the dropdown.

static triggerChange(instance)

Fire a change event on the underlying select. The custom UI edits the select directly, so listeners bound to the original element would otherwise never hear about a selection made through the dropdown.

static updateDisplay(instance)

Refresh the text shown on the closed trigger. Up to two selections are named; beyond that the trigger falls back to a count so a long selection does not stretch the control.

static updateHighlight(instance, items)

Move the keyboard highlight to the current row.

static updateOptions(selectElement, options)

Replace the select's options. Grouped sources are flattened first, so a grouped option list still yields a flat set of rows in the dropdown.

Data attributes used

data-i18n · data-index · data-options-key · data-placeholder · data-required · data-use-opt-groups · data-value

Depends on

DropdownPanel · ElementFactory · ElementManager · EventManager · Utils