Das Selection Controls Pack ersetzt das Standard-Dropdown (Pickup- bzw. Aufzählungssteuerelement) durch moderne Auswahlsteuerelemente. Die Werte eines Pickups werden als Radio Buttons, Checkboxen oder Chips dargestellt – alle Optionen sind sofort sichtbar und mit einem Klick wählbar.
Verfügbare Steuerelemente
Das Paket registriert vier Steuerelemente (je ein PDRControlDescriptorType):
| Steuerelement (TagName) | Titel | Auswahl | Anwendungsfall |
|---|---|---|---|
rootitup-radio-buttons | Radio Buttons | Einzelauswahl | Wenige, sich gegenseitig ausschließende Optionen |
rootitup-chips | Chips | Einzelauswahl | Kompakte, visuell hervorgehobene Einzelauswahl |
rootitup-multi-chips | Multi Chips | Mehrfachauswahl | Kompakte Mehrfachauswahl als Tags |
rootitup-checkboxes | Checkboxes | Mehrfachauswahl | Klassische Mehrfachauswahl, einzeln umschaltbar |
Die Steuerelemente sind für den Einsatz in Dialogen und Assistenten vorgesehen (SupportedWidgetTypes=6).
Architektur
Die Extension wird als Matrix42-Workspaces-Modul (Frontend-Erweiterung) integriert. Das Paket liefert das Modul unter WM/workspaces/RootITUp_SelectionControlsPack/ aus und registriert es über mx.workspacesConfig.registerModule("RootITUp.SelectionControlsPack").
Das Modul RootITUp.SelectionControlsPack ist in AngularJS (1.x) geschrieben und nutzt Angular Material (ngMaterial) für die Darstellung: md-radio-group/md-radio-button für Radio Buttons, md-chip für Chips und md-checkbox für Checkboxen. Jedes Steuerelement wird als Direktive auf Basis von mx.components.FormControlBase registriert.
Genutzte Matrix42-Services
mx.SolutionBuilderAgent.EntityService– lädt die Optionswerte übergetEnumerationValues(entityClassName, filter)mx.components.FormControlControllerBase– Basis-Controller für Validierung und Zustandsverwaltungmx.internationalization– übersetzt die Validierungsmeldungen (z. B. Pflichtfeld über den Schlüsselcomponents.form-validation.required)
Eigenschaften der Steuerelemente
Jedes Steuerelement definiert sechs eigene Eigenschaften (im Descriptor als PDRControlDescriptorClassProperty, Namen in Kebab-Schreibweise):
| Eigenschaft | Pflicht | Beschreibung |
|---|---|---|
entity-class-name | Ja | Name des Pickups bzw. der Enumeration, aus der die Optionen geladen werden (z. B. SVMActivityPickupUrgency). Eine Änderung lädt die Optionen neu. |
value | Ja | Modellbindung; hält bei Einzelauswahl den Wert, bei Mehrfachauswahl ein Array. Wird als Attribut ng-model gebunden. |
filter | Nein | ASQL-Filter zur Einschränkung der Optionen (Attribut data-filter). Eine Änderung lädt die Optionen neu. |
default | Nein | Standardwert, der gesetzt wird, wenn value beim Laden leer ist. Einzelauswahl: ein Wert; Mehrfachauswahl: eine Liste. Standard: null. |
show-value | Nein | Zeigt den Rohwert in Klammern hinter dem Anzeigetext (z. B. „Aktiv (1)”). Standard: False. |
aria-label | Nein | Beschriftung für Screenreader; fällt auf label zurück, wenn nicht gesetzt. |
Darüber hinaus stehen die vom Basissteuerelement geerbten Standard-Eigenschaften zur Verfügung – Label, Hint (Hinweistext) sowie die Zustände Required (Pflichtfeld), Disabled und Read Only. Diese werden im Layout Designer wie bei jedem anderen Steuerelement gesetzt.
Installation – Schritt für Schritt
Die Installation erfolgt über die Matrix42 Extension Gallery. Das Paket importiert dabei die vier Control-Descriptoren und stellt das Workspaces-Modul bereit.
Voraussetzung: administrative Rechte in Ihrem Matrix42-System sowie die Matrix42 Digital Workspace Platform ab Version 12.1.1.
1. Extension Gallery öffnen
Öffnen Sie die Matrix42 Extension Gallery unter extensions.matrix42.com und melden Sie sich mit Ihrem Matrix42-Konto an.
2. Selection Controls Pack suchen
Suchen Sie nach „RootITUp Selection Controls Pack”, öffnen Sie den Eintrag und klicken Sie auf Install.
3. Installation bestätigen
Prüfen Sie im ersten Schritt des Assistenten die Extension-Details – Name, Version und Hersteller – und klicken Sie auf Next.
4. Voraussetzungen prüfen
Der Assistent listet die benötigte Voraussetzung auf – die Digital Workspace Platform. Sobald sie als „Ready” markiert ist, klicken Sie auf Install.
5. Installation abschließen
Warten Sie, bis die Meldung „Installation complete!” erscheint, und schließen Sie den Assistenten mit Finish. Der Anwendungspool wird dabei automatisch neu gestartet.
Konfiguration im Layout Designer – Schritt für Schritt
Nach der Installation stehen die vier Steuerelemente im Layout Designer zur Verfügung. Die folgende Anleitung ersetzt am Beispiel Radio Buttons das Standard-Dropdown eines Pickup-Feldes.
6. Zu ersetzendes Dropdown öffnen
Öffnen Sie den Dialog oder Assistenten mit dem Standard-Dropdown (Pickup-Steuerelement), das Sie ersetzen möchten.
7. Layout-Editor öffnen
Öffnen Sie über das Aktionen-Menü den Layout-Editor der Seite.
8. Pickup-Feld auswählen
Wählen Sie im Layout-Editor das gewünschte Pickup-Feld aus (Beispiel: SVMTaskPickupTypeOfTask). Über die Eigenschaft entity-class-name ist das Steuerelement an den zugehörigen Pickup gebunden.
9. Steuerelement auswählen
Wählen Sie das gewünschte Steuerelement – z. B. Radio Buttons (alternativ Chips, Multi Chips, Checkboxes oder das Standard-Dropdown).
10. Darstellung im Layout-Editor prüfen
Das Feld wird nun als Radio Buttons dargestellt. Passen Sie bei Bedarf Beschriftung (label), Hinweistext (hint) und weitere Eigenschaften an.
11. Layout speichern und veröffentlichen
Speichern Sie das Layout und veröffentlichen Sie es anschließend über die Symbolleiste.
12. Ergebnis im Dialog
Öffnen Sie die Seite erneut: Das frühere Dropdown erscheint jetzt als moderne Radio-Button-Auswahl.
Konfiguration im Detail
Eigenschaften im Property-Grid
Jedes Steuerelement lässt sich im Layout Designer über das Property-Grid anpassen:
| Eigenschaft | Beschreibung |
|---|---|
| Entity Class Name | Pickup/Enumeration, aus der die Optionen geladen werden (Pflicht) |
| Value | Modellbindung des ausgewählten Werts bzw. der Werte (Pflicht) |
| Filter | ASQL zur Einschränkung der Optionen |
| Default Value | Vorausgewählter Wert |
| Show values | Zeigt den Rohwert neben dem Anzeigenamen |
| Aria Label | Beschriftung für Screenreader |
| Label / Hint / Required / Disabled / Read Only | Geerbte Standard-Eigenschaften |
ASQL-Filter
Über das filter-Binding lassen sich die geladenen Optionen einschränken, z. B.:
IsActive = trueEine Änderung am filter löst automatisch ein Neuladen der Optionen aus.
Validierung und Standardwerte
- Pflichtfeld: Ist
requiredgesetzt, prüft das Steuerelement, ob mindestens ein Wert ausgewählt ist. - Fehlermeldungen: werden über
mx.internationalizationlokalisiert (Schlüsselcomponents.form-validation.required). - Zustände:
disabledundreadOnlyverhindern Änderungen und werden korrekt behandelt. - Standardwert: Über
defaultwird ein Wert gesetzt, solangevaluebeim Laden leer ist – bei Einzelauswahl ein einzelner Wert, bei Mehrfachauswahl eine Liste.
Hinweis: Der Wert
0wird als „leer” interpretiert. Ein Pickup-Eintrag mit dem Wert0ist daher nicht auswählbar.
Reaktives Verhalten
| Änderung | Verhalten |
|---|---|
entity-class-name ändert sich | Optionen werden neu geladen |
filter ändert sich | Optionen werden neu geladen |
| Geladene Optionen ändern sich | Nicht mehr gültige Werte werden aus dem Modell entfernt |
Barrierefreiheit
Alle Steuerelemente unterstützen:
aria-label– Beschreibung für Screenreader (fällt auflabelzurück)- Tastaturnavigation – über die Angular-Material-Komponenten
- Fokus- und Rollen-Management – die Templates setzen passende ARIA-Rollen (
radiogroup,listbox,group) undaria-*-Attribute
Changelog
Version 1.6 – Feature Update (15.05.2025)
- Radio Buttons für die exklusive Einzelauswahl
- Checkboxes für die Mehrfachauswahl
- Chips und Multi Chips für die kompakte Einzel- bzw. Mehrfachauswahl
- Dynamisches Laden der Optionen über
entity-class-name - Unterstützung für ASQL-Filter über
filter - Geerbte Standard-Eigenschaften:
label,hint,required,disabled,readOnly - Optionale Rohwert-Anzeige über
show-value - Kompatibel mit der Matrix42 Digital Workspace Platform ab 12.1.1
- Angular Material für ein konsistentes Erscheinungsbild
Häufig gestellte Fragen
Für welche Felder eignen sich die Steuerelemente?
Für Enumeration-basierte Pickups, deren Werte über mx.SolutionBuilderAgent.EntityService.getEnumerationValues abgerufen werden können. Die Eigenschaft entity-class-name erwartet den Namen des Pickups bzw. der Enumeration (z. B. SVMActivityPickupUrgency).
Warum ist der Wert 0 nicht auswählbar?
Die Steuerelemente interpretieren 0 als „kein Wert ausgewählt”. Ein Klick auf eine Option mit dem Wert 0 wird ignoriert. Dies entspricht dem üblichen Verhalten von Enumeration-Feldern, bei denen 0 häufig für „nicht gesetzt” steht.
Lässt sich die Optionsliste dynamisch filtern?
Ja, über das filter-Binding als ASQL-Ausdruck. Eine Änderung am Filter löst automatisch ein Neuladen der Optionen aus.
Was passiert, wenn ein ausgewählter Wert nach dem Neuladen nicht mehr existiert?
Der Wert wird aus dem Modell entfernt. Bei Einzelauswahl wird das Modell auf undefined gesetzt, bei Mehrfachauswahl wird der betreffende Wert aus dem Array entfernt.
Werden zusätzliche Berechtigungen benötigt?
Nein. Das Paket registriert keine zusätzlichen Berechtigungen und nutzt ausschließlich Standard-Dienste der Plattform.
Welche Angular-Version wird verwendet?
Die Extension nutzt AngularJS (1.x) mit Angular Material. Beide sind in der Matrix42 Digital Workspace Platform enthalten.