RAP - Suchhilfe

Inhaltsverzeichnis

• Allgemein
• Einbau Suchhilfe
• Eigene Suchhilfe
• Suchfeld
• Dropdown
• Texte
• Vollständige Suchhilfe
• Fazit

Zu einem sauberen UI und einer guten UX gehören auch Suchhilfen bei befüllbaren bzw. editierbaren Feldern. In diesem Artikel gehen wir etwas näher auf die Suchhilfe ein, wie du sie an die Felder bindest, eigene erstellst oder vorhandene wiederverwendest.

 

Allgemein

Suchhilfen werden so ähnlich wie im Dictionary, am Objekt, angelegt und wirken sich auf dieses Feld aus. Bei Core Data Services verwendet man meist andere Core Data Services, um die Wertvorschläge zu erzeugen. SAP stellt bereits zahlreiche Suchhilfen in Form von Core Data Services im System zur Verfügung. Über die Eclipse Suche, können solche Objekte schnell gefunden werden:

 

Solche Views beginnen in den meisten Fällen mit "I_" oder "C_", wenn sie im richtigen Namensraum angelegt wurden. Innerhalb des Namens findest du dann auch das entsprechende "VH" für "Value Help". Über die Abgrenzung des Typs findest du dann auch nur noch die CDS Views.

Hinweis: Suchhilfen werden vor allem in der Consumption-Schicht eingesetzt, da hier das finale UI der Fiori Elements App erstellt wird. Es muss auch nicht immer ein spezieller VH Views verwendet werden

 

Einbau Suchhilfe

Im ersten Beispiel möchten wir eine Suchhilfe wiederverwenden, die es bereits im Standard gibt, um das Währungsfeld im Partner auswählen zu können. Über die Suche erhalten wir den freigegebenen CDS View "I_CurrencyStdVH", den wir nutzen möchten. Um die Suchhilfe nun am Feld verfügbar zu machen, müssen wir im Consumption View die Annotation am Feld ergänzen:

@Consumption.valueHelpDefinition: [{ entity: { name: 'I_CurrencyStdVH', element: 'Currency' } }]
PaymentCurrency

 

Über das Attribut Entity geben wir den entsprechenden CDS View im Feld "name" mit. Das Feld Element bezieht sich auf das Feld das zurückgegeben werden soll als Ergebnis. Schauen wir uns einmal das Feld vor der Anpassung an:

 

Ein Standardfeld, ohne besondere Merkmale oder Möglichkeiten an Zusatzwerte zu kommen. Nach Einbindung der Suchhilfe ändert sich das Aussehen entsprechend:

 

Im hinteren Teil des Feldes ist nun ein Button mit Icon zu sehen. Über diesen Button rufen wir die Suchhilfe auf und bekommen sie in einem separaten Popup angezeigt. Die Such- und Anzeigefelder ergeben sich aus der Definition des Core Data Service der als Grundlage verwendet wird.

 

Eigene Suchhilfe

Als zweite Suchhilfe wollen wir eine eigene Suchhilfe für die Länderkürzel erzeugen, die wir mit entsprechenden Features anreichern. Bevor wir damit anfangen, hier noch das Suchfeld, bevor eine Suchhilfe verfügbar ist:

 

Zuerst müssen wir dazu einen entsprechenden Core Data Service als Grundlage erzeugen. Dazu setzen wir auf das Interface I_Country und erzeugen damit eine View Entity.

@AccessControl.authorizationCheck: #NOT_REQUIRED
@EndUserText.label: 'Search help for country'
define view entity ZBS_C_CountryVH
  as select from I_Country
{
  key Country,
      _Text[1: Language = $session.system_language].CountryName as Description
}

 

Diesen View binden wir nun noch als Suchhilfe in Consumption View ZBS_C_RAPPartner ein.

@Consumption.valueHelpDefinition: [{ entity: { name: 'ZBS_C_CountryVH', element: 'Country' } }]
Country,

 

Das Feld sieht nach der Einbindung nun wie folgt aus und hat schon einmal eine echte Suchhilfe, mit dem Button, bekommen.

 

Schauen wir uns die Suchhilfe einmal im Detail an, werden wir feststellen, das Schlüsselfeld und Text verfügbar sind und die Felder einen entsprechenden Filter bekommen haben:

 

Suchfeld

Die Filter der letzten Suche waren noch "sperrig" zu bedienen und wir wünschen uns eine ordentliche Eingabe über ein Suchfeld, um den Zugriff zu beschleunigen. Vielleicht sogar noch eine Fuzzy Search, wenn der Anwender nur Teile eingibt oder Rechtschreibfehler mit einbaut. Dazu erweitern wir die Annotationen des Views:

@AccessControl.authorizationCheck: #NOT_REQUIRED
@EndUserText.label: 'Search help for country'
@Search.searchable: true
define view entity ZBS_C_CountryVH
  as select from I_Country
{
      @Search.defaultSearchElement: true
      @Search.fuzzinessThreshold: 0.8
      @Search.ranking: #HIGH
  key Country,
      @Search.defaultSearchElement: true 
      @Search.fuzzinessThreshold: 0.8
      @Search.ranking: #LOW
      _Text[1: Language = $session.system_language].CountryName as Description
}

 

Folgende Schritte führen wir noch durch:

• Als Erstes muss die Eigenschaft "Search.searchable" aktiviert werden, damit wird das allgemeine Suchfeld im View angezeigt wird.
• Im nächsten Schritt müssen die Felder aktiviert werden, über die gesucht wird, das geschieht mit "Search.defaultSearchElement" an jedem relevanten Feld.
• Mit "Search.fuzzinessThreshold" kannst du einstellen wie genau die Suche auf dem Feld ist. Eine Fuzzy Search sucht nach ähnlichen Elementen oder Teilen in Begriffen und zeigt auch Treffer an, die nicht 100% mit dem Suchpattern übereinstimmen.
• Mit "Search.ranking" kann noch bestimmt werden, welche Spalten eher greifen, wenn es zu einem Treffer kommt.

 

Nach der Anpassung sieht die Suchhilfe, also das Popup, nun entsprechend anders aus. Es ist ein entsprechendes Suchfeld hinzugekommen und die Filterfelder wurden ausgeblendet.

 

Über die Suche kannst du nun den Text und den Ländercode einschränken und kommst die entsprechenden Ergebnisse zurück.

 

Dropdown

In manchen Fällen handelt es sich nur um eine kleine Anzahl von Werten und man möchte alles direkt in einer Dropdown Liste für den User zur Verfügung stellen, ohne dass dieser ein Popup verwenden muss. Dazu musst du nur den Core Data Service um ein Element erweitern:

@AccessControl.authorizationCheck: #NOT_REQUIRED
@EndUserText.label: 'Search help for country'
@Search.searchable: true
@ObjectModel.resultSet.sizeCategory: #XS
define view entity ZBS_C_CountryVH
  as select from I_Country
{
      @Search.defaultSearchElement: true
      @Search.fuzzinessThreshold: 0.8
      @Search.ranking: #HIGH
  key Country,
      @Search.defaultSearchElement: true 
      @Search.fuzzinessThreshold: 0.8
      @Search.ranking: #LOW
      _Text[1: Language = $session.system_language].CountryName as Description
}

 

Mit der Annotation "ObjectModel.resultSet.sizeCategory: #XS" wird Fiori Elements mitgeteilt, dass die Ergebnismenge sehr klein ist und aus dem Feld wird direkt ein Dropdown Element:

 

Texte

Als wir das Dropdown eingefügt haben, ist dir sicherlich aufgefallen, dass nun die Texte fehlen und auch kein Popup mehr zur Verfügung steht, um sich diese anzeigen zu lassen. In solchen Fällen können wir noch den Text in der Dropdown bzw. auch in der Standardsuche ergänzen, damit der User mehr Informationen erhält und dieser auch nicht mit den technischen Werten arbeiten muss. Dazu stehen uns zwei Element zur Verfügung:

• @ObjectModel.text.element: [ 'Description' ] - Dabei verweisen wir auf ein Feld der Entität in dem der Text steht. Hier spielt die Sprache keine Rolle, sondern es wird der Inhalt des Feldes verwendet.
• @ObjectModel.text.association: '_Text' - Dabei verwenden wir die Textassoziation der Entität. Die App kümmert sich dann um die Sprache und den anzuzeigenden Text.

 

Wenn das Feld im Anzeigemodus ist, dann erhalten wir den Text + den entsprechenden technischen Schlüssel:

 

Wenn das Feld im Editiermodus ist, erhält der Anwender nur noch den Text und kann diesen über das Dropdown auswählen:

 

Da das Feld eingabebereit ist, kann man auch nach dem Land suchen, wenn man mit der Eingabe im Feld beginnt. Mit jedem Buchstaben verringert sich die Menge an Treffern in der Liste:

 

Vollständige Suchhilfe

Nachdem nun die Suchhilfe die volle Ausprägung hat, hier noch einmal zur Übersicht der gesamte CDS View. Dabei haben wir noch ein Semantics Objekt aufgenommen, um zu zeigen, dass es sich bei "Description" um ein Textfeld handelt.

@AccessControl.authorizationCheck: #NOT_REQUIRED
@EndUserText.label: 'Search help for country'
@Search.searchable: true
@ObjectModel.resultSet.sizeCategory: #XS
define view entity ZBS_C_CountryVH
  as select from I_Country
{
      @Search.defaultSearchElement: true
      @Search.fuzzinessThreshold: 0.8
      @Search.ranking: #HIGH
      @ObjectModel.text.element: [ 'Description' ]
  key Country,
      @Semantics.text: true
      @Search.defaultSearchElement: true 
      @Search.fuzzinessThreshold: 0.8
      @Search.ranking: #LOW
      _Text[1: Language = $session.system_language].CountryName as Description
}

 

Fazit

Die Definition von Suchhilfen ist recht einfach, da bereits Standard CDS Views dafür genutzt werden können. Wenn der View dann noch mit zusätzlichen Annotationen angereichert wird, ergeben sich nützliche Features für den Anwender. Wichtig vielleicht auch noch, dass die Features der Suchhilfe über den entsprechenden CDS View gesteuert werden.