Dynamische Felder in Dialogen bereitstellen

Nach dem Anlegen und Konfigurieren eines Dynamischen Feldes können Sie es in den Oberflächen von Dialogen bereitstellen, damit Agenten Werte darin hinterlegen können. Der in der Konfiguration des Dynamischen Felds gewählte Objekttyp ist hierbei maßgeblich. Er bestimmt das Objekt (Ticket, FAQ, Kontakt, Organisation), in dem das Dynamische Feld eingebunden werden kann.

So können bspw. Dynamische Felder vom Objekttyp "Ticket" ausschließlich in ticketrelevanten Oberflächen eingebunden werden (Dialoge "neues Ticket", "Ticket bearbeiten", Detailansicht etc.), nicht aber in FAQ-Artikeln oder in Organisationen.

Die Integration Dynamischer Felder in die Oberfläche eines Ticket-Dialogs erfolgt bequem durch Drop-Down-Auswahl des Dynamischen Feldes in der Konfiguration einer Ticketvorlage bzw. Aktion (Seite Eingabefelder). KIX Pro verwendet für den Dialog Neues Ticket die Ticketvorlage Default - New Ticket Template. Für den Dialog Ticket bearbeiten existiert die Ticketaktion Ticket Edit. Die Konfiguration in den SysConfig-Schlüsseln wird lediglich als Fallback genutzt.

Alternativ dazu kann die Integration eines Dynamischen Feldes durch Bearbeiten des entsprechenden Konfigurationsschlüssels im Menü System > GUI Konfiguration > Agentenportal | Self Service Portal (oder System > SysConfig) erfolgen. Beispielsweise, um ein Dynamisches Feld am Kontakt oder Organisation zu etablieren.

Für individuelle Elemente (z. B. Name des Dynamischen Feldes) müssen Sie die Übersetzung selbst pflegen. Hinterlegen Sie dazu im Menü Internationalisierung > Übersetzungen die entsprechenden Pattern.

Hinweis

Hinweis: Dynamische Felder können nicht an Assets bereitgestellt werden. Sie können jedoch einer Asset- Klassendefinition individuelle Felder hinzufügen (s. Eine Klassendefinition bearbeiten).

Beispiel: Integration in den Dialog "Neuer Kontakt"

Konfigurationsschlüssel

contact-new-form-group-information

Im Beispiel wird das Dynamisches Feld ShortName in den Dialog Neuer Kontakt integriert. In diesem Feld sollen Agenten eine Kurzbezeichnung des Kontakts hinterlegen können.

Voraussetzung für das Beispiel ist, dass im Menü System > Dynamische Felder ein gleichnamiges Dynamisches Feld vom Typ "Text" und mit Objekttyp "Kontakt" angelegt wurde.

Die Integration in andere Dialoge (z. B. Kontakt bearbeiten) erfolgt auf gleiche Weise in den entsprechenden SysConfig-Schlüsseln.

Hinweis

Dynamische Felder können nur in System-Konfigurationen des Typs form-group integriert werden, da nur diese den Parameter formFields enthalten. Infos dazu liefern in der SysConfig die Spalte Metadaten und/oder die Suche nach dem Suchparameter: *form-group*.

Gehen Sie wie folgt vor:

Navigieren Sie im Explorer zu System > GUI Konfiguration > Agentenportal.
Suchen und öffnen Sie den SysConfig-Schlüssel in dessen Dialog Sie das Dynamische Feld integrieren möchten (z. B.:Dialog Neuer Kontakt: contact-new-form-group-information).

Fügen Sie den nachfolgenden Codeblock (ohne Kommentare!) in den Codeblock unter formFields:[...] ein.

Hinweis: Je nach Konfigurationsschlüssel kann dieser Parameter initial leer sein.

{
   "id": "contact-new-form-field-dfshortname",  // eindeutige ID des DFs im Schlüssel
   "label": null,
   "property": "DynamicFields",
   "inputComponent": null,
   "required": false,   // Pflichtfeld ja/nein?
   "hint": "Translatable#Kurzbezeichnung des Kontakts",  //Übersetzbarer Hinweistext
   "options": [
      {
         "option": "FIELD_NAME",
         "value": "DFShortName"   // Name des DFs, wie im System angelegt
      }
   ],
   "defaultValue": {
      "value": null,
      "valid": true,
      "errorMessages": []
   },
   "fieldConfigurationIds": [],
   "children": [],
   "parentInstanceId": null,
   "countDefault": null,
   "countMax": null,
   "countMin": null,
   "maxLength": null,
   "regEx": null,
   "regExErrorMessage": null,
   "empty": false,
   "asStructure": false,
   "readonly": false,
   "placeholder": null,
   "existingFieldId": null,
   "showLabel": true,
   "name": null,
   "draggableFields": false,
   "defaultHint": "Translatable#optionaler_ Hilfetext",
   "type": "FormField",
   "visible": true,
   "translateLabel": true,
   "instanceId": null
}

Optional: Fügen Sie den Codeblock ggf. mehrfach ein, wenn weitere Dynamische Felder im Dialog integriert werden sollen.
Trennen Sie die Codeblöcke durch Kommas, da je zwei aufeinanderfolgende Codeabschnitte durch Kommas voneinander getrennt werden.
Jeder Codeabschnitt beginnt und endet stets mit einer geschweiften Klammer ({..} ).
Entfernen Sie die Kommentare im Codeblock, sofern noch nicht geschehen.
Ersetzen Sie die im Beispiel genannte ID contact-new-form-field-dfshortname durch eine eigene, aussagekräftige ID.
Sie können die ID frei benennen, sie darf jedoch nur einmal im gesamten Formular enthalten sein und darf nicht identisch mit dem unter value gesetzten Wert sein. Daher empfiehlt sich eine "sprechende“ ID.
Ersetzen Sie unter value den Beispielwert DFShortName durch den Namen des einzubindenden Dynamischen Feldes.
Es ist der in der Konfiguration des Dynamischen Feldes definierte Name anzugeben.
Ergänzen Sie im Codeblock fieldConfigurationIDs die eindeutige ID des Dynamischen Feldes.
Es ist die im Parameter id angegebene Bezeichnung anzugeben.
Die Reihenfolge der Feld-IDs bestimmt die Reihenfolge der Formularfelder in der Ticketerstellmaske.
Wird hier keine ID angegeben, wird das Dynamische Feld immer an letzter Stelle im Formular eingebunden. Dabei wird die im Codeblock formFields[...] angegebene Reihenfolge berücksichtigt.
Klicken Sie abschließend auf Speichern.
Klicken Sie im Header der SysConfig auf Lade Frontend-Konfigurationen neu, um die Ansicht im Frontend zu aktualisieren.

Das Dynamische Feld ist nun im Dialog eingebunden und kann von den Agenten genutzt werden.

Beispiel: Integration in den Dialog "Organisation bearbeiten"

Konfigurationsschlüssel

Abhängig von der Platzierung im Dialog:

Abschnitt Organisations-Informationen:
organisation-edit-form-group-information
Abschnitt Adresse:
organisation-edit-form-group-address
Abschnitt E-Mail-Adressen-Domain:
organisation-edit-form-group-domain
Abschnitt andere:
organisation-edit-form-group-other

Im Beispiel wird das Dynamische Feld ShortName in den Dialog Organisation bearbeiten integriert. In diesem Feld sollen Agenten eine Kurzbezeichnung der Organisation hinterlegen können. Das Dynamische Feld wird dabei in den Dialog-Abschnitt Organisations-Informationen integriert. Soll das Dynamische Feld an anderer Stelle im Dialog eingebunden werden, nehmen Sie die Änderungen bitte am entsprechenden Konfigurationsschlüssel vor (s. Tabelle oben).

Abb.: Das Dynamische Feld im Dialog "Organisation bearbeiten"

Voraussetzung für das Beispiel ist, dass im Menü System > Dynamische Felder ein gleichnamiges Dynamisches Feld vom Typ "Text" und mit Objekttyp "Organisation" angelegt wurde.

Hinweis

Gehen Sie wie folgt vor:

Navigieren Sie zum Menü System > SysConfig.
Navigieren Sie im Explorer zu System > GUI Konfiguration > Agentenportal.
Suchen und öffnen Sie den Konfigurationseintrag: Organisation bearbeiten und klicken Sie auf Organisations-Informationen, um die Konfiguration für den Abschnitt Organisations-Informationen zu öffnen.

Bearbeiten Sie den Wert des Schlüssels wie folgt:

Fügen Sie im Codeblock "fieldConfigurationIds":[...] eine eindeutige ID für das Dynamische Feld ein (z. B.: organisation-edit-form-field-Shortname).
Die ID (Bezeichnung) kann frei gewählt werden, darf aber nur einmal in der Konfiguration enthalten sein.

Fügen Sie folgenden Code in den Abschnitt "formFields":[ ]. Platzieren Sie den Code zwischen die eckigen Klammern.

Der Abschnitt ist initial leer, da der Dialog fest im Backend verankert ist. Sie müssen daher das komplette Set an Formularfeldern integrieren - auch die initial existierenden Formularfelder.

Sollten Sie einen anderen Abschnitt im Dialog gewählt haben, müssen Sie die Formularfelder des Codebeispiels an die initial existierenden Formularfelder des gewählten Abschnitts anpassen.

// Integration des Dynamischen Feldes ShortName
{
  "id": "organisation-edit-form-field-Shortname",  
  "property": "DynamicFields",
  "required": false,
  "options": [
    {
      "option": "FIELD_NAME",
      "value": "ShortName"  //Name des Dynamischen Feldes
    }
  ],
  "showLabel": true,
  "type": "FormField",
  "visible": true,
  "translateLabel": true,
  "instanceId": null
}, //Ende Dynamisches Feld

// Nachfolgend alle weiteren Formularfelder analog initialer Konfiguration
{
  "id": "organisation-new-form-field-MailDomain",
  "property": "DynamicFields",
  "required": false,
  "options": [
    {
      "option": "FIELD_NAME",
      "value": "MailDomain"
    }
  ],
  "showLabel": true,
  "type": "FormField",
  "visible": true,
  "translateLabel": true,
  "instanceId": null
},
{
  "id": "organisation-new-form-field-IfsVersion",
  "property": "DynamicFields",
  "required": false,
  "options": [
    {
      "option": "FIELD_NAME",
      "value": "IfsVersion"
    }
  ],
  "showLabel": true,
  "type": "FormField",
  "visible": true,
  "translateLabel": true,
  "instanceId": null
 },
 }
  "id": "organisation-new-form-field-IfsCloudYN",
  "property": "DynamicFields",
  "required": false,
  "options": [
    {
      "option": "FIELD_NAME",
      "value": "IfsCloudYN"
    }
  ],
  "showLabel": true,
  "type": "FormField",
  "visible": true,
  "translateLabel": true,
  "instanceId": null
},
{
  "id": "organisation-new-form-field-KeyAccountEmail",
  "property": "DynamicFields",
  "required": false,
  "options": [
    {
      "option": "FIELD_NAME",
      "value": "KeyAccountEmail"
    }
   ],
  "showLabel": true,
  "type": "FormField",
  "visible": true,
  "translateLabel": true,
  "instanceId": null
},
{
  "id": "organisation-new-form-field-ProjectManagerEmail",
  "property": "DynamicFields",
  "required": false,
  "options": [
   {
     "option": "FIELD_NAME",
     "value": "ProjectManagerEmail"
    }
  ],
  "showLabel": true,
  "type": "FormField",
  "visible": true,
  "translateLabel": true,
  "instanceId": null
},
{
  "id": "organisation-new-form-field-CustomerContactEmail",
  "property": "DynamicFields",
  "required": false,
  "options": [
    {
      "option": "FIELD_NAME",
      "value": "CustomerContactEmail"
    }
  ],
  "showLabel": true,
  "type": "FormField",
  "visible": true,
  "translateLabel": true,
  "instanceId": null
},
{
  "id": "organisation-new-form-field-CustomerContactPhone",
  "property": "DynamicFields",
  "required": false,
  "options": [
    {
      "option": "FIELD_NAME",
      "value": "CustomerContactPhone"
    }
  ],
  "showLabel": true,
  "type": "FormField",
  "visible": true,
  "translateLabel": true,
  "instanceId": null
 }
],

Abb.: Die geänderte Konfiguration

Entfernen Sie die mit Kommentare im Code (// Kommentartext).
Nehmen Sie bei Bedarf weitere Änderungen am Code vor, z. B. Änderung der Bezeichnungen oder Ergänzung weiterer Dynamischer Felder.
Info: Die Reihenfolge der fieldConfigurationIDs bestimmt die Reihenfolge der Formularfelder im Dialog.

Minimieren Sie im Editor den Quellcode, um unnötige Leerzeichen und Zeilenumbrüche zu entfernen und kopieren Sie den Quellcode in die Zwischenablage.
Fügen Sie den Quellcode aus der Zwischenablage zurück nach KIX ins Feld Wert und übernehmen Sie die Änderungen mit Speichern.
Klicken Sie auf Lade Frontend Konfiguration neu, damit das Dynamische Feld im Dialog Organisation bearbeiten angezeigt wird.

Danach ist das Dynamische Feld im Dialog Organisation bearbeiten enthalten. Ggf. müssen die Agenten einen Browser-Refresh durchführen.

Tipp

Um die am Feld gespeicherten Werte (hier die vom Agent eingetragene Kurzbezeichnung) in der Detailansicht der Organisation anzuzeigen, verfahren Sie wie unter Anzeige in Objekt-Info-Widgets beschrieben. Bearbeien Sie dazu den SysConfig-Schlüssel organisation-details-info-widget.

In diesem Abschnitt:

Dynamische Felder in Dialogen bereitstellen

Hinweis

Beispiel: Integration in den Dialog "Neuer Kontakt"

Hinweis

Beispiel: Integration in den Dialog "Organisation bearbeiten"

Hinweis

Tipp

Suchresultat