Multi select enumeration

Content Type: Widget
Categories: User Interface,Visualization,Data

Overview

With this widget you can easily select multiple values of an enumeration via checkboxes.

It generates a list of checkboxes based on the possible values of the enumeration, the user can select multiple values (unlike regular enumerations which behave like radio buttons: only one value can be selected).

Documentation

MultiSelectEnum

With this widget you can easily select multiple values of an enumeration via checkboxes.

appstore


Example use cases

Any situation where you want a fixed set of values (enumeration) that can be easily translated and stored on a single object. Some examples:

  • Selecting which languages /days / documents are available
  • Creating checklists & showing completed items;
  • Building advanced search functionality;
  • Indicating skill set

Screenshot of an example page

In this screenshot the widget is shown in multiple configurations (editable, read only as text, read only as control, horizontal and vertical).

preview


Features

  • Multi-select
  • Translatable values
  • Store data on a single entity
  • Display the list in a horizontal or vertical direction
  • Specify the text of the label
  • Attach a microflow for the on-change event
  • Show text only version

Usage

Download the widget into your app and add Multi Select Enum widget to a data view on your page. Configure the properties described below to determine how the widget will behave in your application

  1. Label - set the label value (question or other hint for the checkboxes) or turn show label off
  2. Orientation – determines if the checkbox items will render horizontally or vertically
  3. Attribute enum – an attribute that is on the entity used in the data view. The attribute needs to be of the type enumeration type. This enumeration will be used to generate all the checkbox items
  4. Attribute string – an attribute of the type string, which will store the selected values of the enumeration
  5. On change - this is the action that will be invoked for an on-change event, if any of the checkboxes is clicked, this action will be started (e.g. execute nanoflow, microflow, save changes)

Limitations

This widget requires 2 attributes: the enumeration attribute to define the enumeration and a string attribute to store the selected values as a comma separate list. Note: the enumeration attribute can still be used for the standard behavior (like for selecting one value of the enumeration. This works independently of the multi-select functionality. The enumeration attribute is only required to determine which list of possible values to render.

Notes

The string attribute is used to store the selected enumeration values. Make sure that the length of the string attribute is equals (or is larger than) the following sum: length of enumeration keys + number of enumeration keys - 1.The widget is display/input widget, but the comma separate list of string values can also be used in microflows. Use StringSplit in the CommunityCommons module to get split the string attribute in to separate values.


Releases

Version: 1.2.3
Framework Version: 9.0.5
Release Notes: Release version 1.2.3 - Remove limitation on sub-keys in the enumeration not being support (e.g. HelloWorld, and HelloWorldUSA wasn't allowed), this is now correctly handled by the widget.
Version: 1.2.2
Framework Version: 9.0.5
Release Notes: Release version 1.2.2 - Fix positioning of Alert Validation Feedback message (it is now shown below the checkboxes instead of next to it when the orientation is set to vertical).
Version: 1.2.1
Framework Version: 9.0.5
Release Notes: - Fix issue where unchecked booleans were also shown as selected (when widget is read only and read only style is set to text)
Version: 1.1.1
Framework Version: 9.0.5
Release Notes: Release version 1.1.1 Two bug fixes: - Enumerations where the key only exists of 1 character were not being set after selecting, this has been fixed to include enumeration keys with a length of 1 - Loading the widget more than once on the same page would cause issues if there were enumeration keys that would occur more than once (example: selecting the value "A" for _MultiSelectEnum-widget1_ would also select it for _MultiSelectEnum-widget2_ if that key occurred there as well). This has been fixed by using the widget identifier + enumeration key to the _for_ attribute and _id_ of the input element.
Version: 1.1.0
Framework Version: 9.0.5
Release Notes: Release version 1.1.0 - Add feature: checkbox item orientation: horizontal | vertical - Change DOM structure -- Add div's and classes: checkboxes__item, checkboxes + move label as sibling to input instead of parent -- Add class checked to checkbox label in case of selected -- Add for property to label