agorum.composite.form.element.emailAddress

Dieses Element dient der Eingabe und Auswahl von E-Mail-Adressen. Sie können es über Parameter in Verhalten und Darstellung anpassen. Außerdem bietet es eine Validierung der eingetragene()n E-Mail-Adresse(n). Diese Validierung können Sie nicht abstellen oder ändern, Sie können die Validierung aber um eigene Validierungen erweitern.

agorum.composite.form.element.emailAddress erbt alle Grundeigenschaften von element.

Beispiel einer grafischen Oberfläche

---

Skript zur grafischen Oberfläche

let aguila = require('common/aguila');
let widget = aguila.create({
  type: 'agorum.composite.form.basic',
  width: 400,
  elements: [
    {
      type: 'agorum.composite.form.element.emailAddress',
      label: 'E-Mail Adresse',
      name: 'email',
      addressType: 'recipient',
      value: ['roi@agorumcore.com', 'demo@agorumcore.com']
    }
  ]
});
widget;

Parameter

---

dataSource

Erwartet einen MetaDB-Pfad als String zu der gewünschten dataSource, die das System für die Auswahl von E-Mail-Adressen verwendet.

• Verwenden Sie diesen Parameter, wenn die Datenquelle bereits bekannt ist und Sie sie nicht dynamisch zusammenstellen, etwa beim Einsatz einer CSV-Datei oder dem Zugriff auf externe Datenbanken und Systeme.
• Sie müssen keinen Lookup implementieren, da das Element mit der Einstellung textIsValue arbeitet.
• Die dataSource muss den gleichen Wert für text und value zur Verfügung stellen.

Beispiel

form.down('email').dataSource = 'MAIN_MODULE_MANAGEMENT/....';

data

Erwartet ein Array aus Objektdefinitionen als Datenbasis für die Auswahl der E-Mail-Adresse in diesem Element.

• Das Array besteht aus einer Objektdefinition mit den Keys text und value.
• Die Werte für text und value müssen jeweils gleich sein, da das Element so eingestellt ist, dass textIsValue eingeschaltet ist (siehe Beispiele).
   

Beispiele

let data = [
  {
    value: 'name@domain.de',
    text: 'name@domain.de'
  },
  {
    value: 'name2@domain.de',
    text: 'name2@domain.de'
  }
];

form.down('email').data = [
  {
    value: 'name@domain.de',
    text: 'name@domain.de'
  },
  {
    value: 'name2@domain.de',
    text: 'name2@domain.de'
  }
];

addressType

Steuert das Verhalten des Elements.

Parameter

Sie können dem Parameter diese Werte als String übergeben:

Parameter	Beschreibung
Keinen Wert / Parameter nicht angegeben	Das Element stellt sich als einfaches Eingabefeld dar.  Wählen Sie diesen Wert, wenn das System eine E-Mail-Adresse abfragen soll. In das Eingabefeld kann der Benutzer jede E-Mail-Adresse eintragen.
recipient	Das Element stellt sich als Mehrfachauswahl dar. Wählen Sie diesen Wert, wenn das System eine Auswahl an E-Mail-Adressen anbieten soll. In die Mehrfachauswahl kann der Benutzer mehrere E-Mail-Adressen eintragen oder aus verfügbaren E-Mail-Adressen in agorum core wählen.
sender	Das Element stellt sich als Einfachauswahl dar. Wählen Sie diesen Wert, wenn das System eine Auswahl an E-Mail-Adressen des Benutzers anbieten soll. In die Einfachauswahl kann der Benutzer jede E-Mail-Adresse eintragen oder aus seinen E-Mail-Adressen wählen, die in seinem Benutzer definiert sind.

Beispiel

form.down('email').addressType = 'sender';

multi

Steuert bei der Definition einer eigenen dataSource oder einer eigenen data-Struktur, ob das Element eine Mehrfach- oder eine Einfachauswahl zur Verfügung stellt.

• Wenn Sie weder data noch dataSource definieren, so entsteht ein leeres Multi-Auswahlfeld ohne Datenquelle. Ein Benutzer kann dann E-Mail-Adressen eingeben. Bei allen anderen Parametern gibt das Element die Darstellung selbst vor.
• Im Standard steht der Wert auf false.
• Sie können den Parameter nachträglich ändern:

form.down('email').multi = true;

Beispiel

{
  data: [
    {
      value: 'entry-1',
      text: 'Eintrag 1'
    },
    {
      value: 'entry-2',
      text: 'Eintrag 2'
    }
  ],
  multi: true
}

restricted

Wert	Beschreibung
true	Beschränkt die Eingabe auf die Werte der jeweiligen Datenquelle.
false (Standard)	Beschränkt die Eingabe nicht auf die Werte der jeweiligen Datenquelle.

Beispiel

restricted: true

Events

---

Bis auf die Changed-Events existieren keine weiteren Events.