In Microsoft Dynamics 365 werden Datensätze einer Entität (z. B. Kontakte) als Ansicht in Tabellenform/Spalten dargestellt. Diese Auflistung kann je nach Komplexität und Anzahl der Datensätze schon mal unübersichtlich werden. Neben der Möglichkeit, Ansichten zu filtern (z. B. alle Kontakte aus Deutschland) können Sie ausgewählte Datensätze innerhalb einer Ansicht auch visuell kennzeichnen (z.B. Länderflagge), um die gewünschten Datensätze schneller zu finden.
Im heutigen Blogartikel zeigen wir Ihnen anhand zweier Beispiele, wie Sie Grafiken basierend auf Feldwerten anzeigen können.
Beispiel 1: Geschlecht darstellen
In diesem Beispiel zeigen wir, wie Sie die Ansicht der Kontakte entsprechend des Geschlechtes in weiblich, männlich oder divers anpassen und anzeigen können.
Hier sind kurzgefasst die erforderlichen Schritte:
- Schritt 1: Erstellen von Bild-Webressourcen
- Schritt 2: Erstellen von Optionssatz
- Schritt 3: Erstellen von JavaScript-Webressource
- Schritt 4: Verknüpfung des Codes mit der Ansicht
Schritt 1: Erstellen von Bild-Webressourcen
Zuerst müssen die Bilder für die Symbole in den Webressourcen gespeichert werden. Navigieren Sie dazu in Ihrer Lösung in den Bereich Webressourcen und erstellen Sie für jedes Icon eine neue Webressource. Verwenden Sie am besten die Bilder im 16*16-Pixel-PNG-Format.
Schritt 2: Erstellen von Optionssatz
Wir benötigen außerdem einen Optionssatz, um die Icons basierend auf den Informationen des Datensatzes ausgewählten Optionen anzuzeigen. Das Feld, das wir in diesem Beispiel verwenden, ist das standardmäßige Feld für das Geschlecht. (Natürlich lässt sich dieses Vorgehen auf jedes Option-Set anwenden.)
Für den Code brauchen wir die technischen Werte der verschiedenen Optionen.
Schritt 3: Erstellen von JavaScript-Webressource
Im nächsten Schritt erstellen Sie eine Webressource vom Typ JavaScript. In diesem JavaScript geben Sie an, welches Icon für welchen Wert des Optionssatzes angezeigt werden soll.
Navigieren Sie wie im ersten Schritt unter Webressourcen und erstellen Sie die Webressource mit folgenden Einstellungen:
- Name: Sie können die Webressource beliebig benennen (in dem Beispiel heißt die Webressource: „inf_/contact/scripts/display_icon.js“).
- Typ: Skript (JScript)
Unten sehen Sie den Code, den wir für dieses Beispiel verwenden:
//Hinzufügen von Icons und einer Quickinfo in der Kontakt-Ansicht in CRM
function displayIcon(rowData, userLCID) {
//rowData in das JSON-Format parsen
var str = JSON.parse(rowData);
//Abrufen des gewünschten Felds aus den JSON-Daten für die Zeile
var colData = str.gendercode_Value;
var imgName = "";
var tooltip = "{" + colData +"}";
switch (colData) {
case 1:
imgName = "inf_/person_man.png";
tooltip = "Männlich";
break;
case 2:
imgName = "inf_/person_woman.png";
tooltip = "Weiblich";
break;
case 3:
imgName = "inf_/person_unknown.png";
tooltip = "Divers";
break;
default:
imgName = "inf_/person_unknown.png";
tooltip = "Divers";
break;
}
var resultarray = [imgName, tooltip];
//Berechnungen an CRM zurückgeben
return resultarray;
}
Hier arbeiten wir in einer deutschsprachigen Umgebung. Wenn der Code mehrere Sprachen unterstützen soll, können Sie den Code wie folgt bearbeiten:
case 2:
imgName = "new_Female";
switch (userLCID) {
case 1033: //Englisch
tooltip = "Male";
break;
default:
tooltip = "Männlich";
break;
}
Speichern und veröffentlichen Sie die Änderungen. Sobald Sie veröffentlicht haben, kann die Ansicht angepasst werden (diese Funktionalität können Sie sowohl in Systemansichten als auch in persönlichen Ansichten verwenden). Stellen Sie sicher, dass die Spalte Geschlecht in der Ansicht vorhanden ist. Falls nicht, klicken Sie auf „Spalten hinzufügen“, um die Spalte hinzufügen.
Schritt 4: Verknüpfung des Codes mit der Ansicht
Nun soll das JavaScript mit der Spalte Geschlecht in der Ansicht verknüpft werden. Wählen Sie die Spalte Geschlecht aus und klicken Sie auf die Option "Eigenschaft ändern".
Wählen Sie in dem Lookup „Webressource“ die JS-Webressource und geben Sie die Funktion an. Sie können bei Bedarf die Breite der Spalte bearbeiten und anpassen. Klicken Sie auf Speichern und veröffentlichen Sie die Anpassungen.
Gehen Sie zur Ansicht zurück und die Symbole werden angezeigt.
Beispiel 2: Hinzufügen des Entitätsbilds eines Kontaktes in einer Ansichtsspalte
Hier sind kurzgefasst die erforderlichen Schritte:
- Schritt 1: Erstellen von JavaScript-Webressource
- Schritt 2: Verknüpfung des Codes mit der Ansicht
Schritt 1: Erstellen von JavaScript-Webressource
Erstellen Sie eine Webressource mit der folgenden Einstellung:
- Name: Sie können die Webressource beliebig benennen. (in dem Beispiel heißt die Webressource: „inf_/contact/scripts/display_icon.js“).
- Typ: Skript (JScript)
Verwenden Sie hierfür den beigefügten Code:
// Hinzufügen von Entitätsbild in Kontakt-Ansicht
function displayEntityImage(rowData, userLCID) {
var str = JSON.parse(rowData);
// Die Entitätsbild-URL ist bereits im Entityimage_url_value-feld des rowData-JSON verfügbar. Das bedeutet, dass dies nicht über den Webservice abgerufen werden muss. Es wird nur die Entitätsbild-URL zusammen mit dem Namen zurückgegeben (als Tooltip).
var imgName = str.entityimage_url_Value;
var tooltip = str.name_Value;
var resultarray = [imgName, tooltip];
//Berechnungen an CRM zurückgeben
return resultarray;
}
Schritt 2: Verknüpfung des Codes mit der Ansicht
Nun kann der Code wie im vorherigen Beispiel mit einer beliebigen Ansichtsspalte verknüpft werden. Suchen Sie hier die Webressource, fügen Sie diese anschließend als Webressource für die Spalte hinzu und geben Sie die Funktionsnamen an (hier: displayEntityImage).
Sobald Sie gespeichert und veröffentlicht haben, navigieren Sie unter Ansicht. Jetzt wird das Entitätsbild in der Ansicht angezeigt.
Das Anzeigen von Grafiken neben Ansichtsspalten ist eine großartige Funktion, mit der Sie Ihre Ansichten optisch und ansprechend gestalten können. Es gibt dem Benutzer auf einen Blick gute Informationen und eine Vorstellung davon, um welchen Datensatz es sich handelt.