Beispiel: Erstellen eines abhängigen OptionSets-Elements (Auswahllisten)

Artikel
07/06/2017

Veröffentlicht: November 2016

Gilt für: Dynamics CRM 2015

Es ist üblicherweise erforderlich, die Werte in einem Optionssatzfeld mit einem Wert zu filtern, der in einem anderen Optionssatz ausgewählt wird. In diesem Thema wird ein Ansatz beschrieben, um dies mit einer wieder verwendbaren JScript-Bibliothek, Formularereignissen und einer XML-Webressource zu erzielen.

Um die Funktionen dieses Beispiels zu beobachten und zu überprüfen, können Sie die verwaltete DependentOptionSetsSample_1_0_0_2_managed.zip-Lösung vom folgenden Speicherort im SDK-Download isntallieren: SDK\SampleCode\JS\FormScripts

Laden Sie das Microsoft Dynamics CRM SDK-Paket herunter.

Ziele für diese Lösung

Diese Lösung soll die folgenden Anforderungen erfüllen:

Sie bietet eine allgemeine, wiederverwendbare JScript- Bibliothek, die für alle Optionssatzfeldpaare verwendet werden kann.
Sie ermöglicht eine Kette abhängiger Optionssatzfelder. Da die Optionen jedes abhängigen Optionssatzfelds auf Grundlage des Werts eines anderen Felds gefiltert werden, können weitere Optionssatzfeldoptionen durch die Option gefiltert werden, die im ersten abhängigen Optionssatzfeld ausgewählt wurde. Dadurch besteht die Möglichkeit zu einem Satz hierarchisch abhängiger Optionssatzfelder.
Das Filtern abhängiger Optionen wird in einer XML Webressource festgelegt. Dadurch können die Optionszuordnungen ohne Änderung des Codes geändert werden. Das Bearbeiten einer XML-Webressource ist für einen Nicht-Entwickler einfacher mit weniger Verkaufschancen zu konfigurieren, die den Code unterbrechen.
Die Lösung unterstützt mehrere Sprachen. Die Filterung basiert nur auf dem Datenwert der Optionen anstatt irgendwelchem Text in den Optionen.
Das Filtern funktioniert bei einer beliebigen Anzahl von Instanzen eines Attributsteuerelements im Formular.

Beispiel

Dieser Abschnitt beschreibt eine Anwendung dieses Ansatzes und die das Verfahren, die Beispielbibliothek anzuwenden.

Das Ticket (sample_ticket)-Entitätsformular hat drei Optionssatzfelder und Optionen zur Kategorisierung der Produkte. Die folgende Tabelle zeigt das gewünschte Filtern von Optionen der Optionssätze.

Kateg. (sample_category)	Unterkategorie (sample_subcategory)	Typ (sample_type)
Wert:727000000 Beschriftung: Software	Wert:727000000 Beschriftung: Persönliche Produktivität	Wert:727000000 Beschriftung: Textverarbeitungsprogramm
		Wert:727000001 Beschriftung: Tabelle
		Wert:727000002 Beschriftung:Internetbrowser
		Wert:727000003 Beschriftung:E-Mail
	Wert:727000001 Beschriftung: Geschäftsanwendungen	Wert:727000004 Beschriftung: Kundenbeziehungsmanagement
		Wert:727000005 Beschriftung: Unternehmensressourcenverwaltung
		Wert:727000006 Beschriftung: Personalressourcenverwaltung
	Wert:727000002 Beschriftung: Betriebssysteme	Wert:727000007 Beschriftung: Windows Vista
		Wert:727000008 Beschriftung: Windows 7
		Wert:727000009 Beschriftung: Windows Server 2003
		Wert:727000010 Beschriftung: Windows Server 2008
Wert:727000001 Beschriftung: Hardware	Wert:727000003 Beschriftung: Desktopcomputer	Wert:727000011 Beschriftung: Arbeitsstation x1000
		Wert:727000012 Beschriftung: Arbeitsstation x2000
		Wert:727000013 Beschriftung: Arbeitsstation x3000
		Wert:727000014 Beschriftung: Arbeitsstation x4000
	Wert:727000004 Beschriftung: Laptopcomputer	Wert:727000015 Beschriftung: Laptop 1000 Reihe
		Wert:727000016 Beschriftung: Laptop 2000 Reihe
		Wert:727000017 Beschriftung: Laptop 3000 Reihe
		Wert:727000018 Beschriftung: Laptop 4000 Reihe
	Wert:727000005 Beschriftung: Bildschirm	Wert:727000019 Beschriftung: CRT-XYZ 17 Zoll
		Wert:727000020 Beschriftung: LCD-XYZ 17 Zoll
		Wert:727000021 Beschriftung: LCD-XYZ 21 Zoll
		Wert:727000022 Beschriftung: LCD-XYZ 24 Zoll
	Wert:727000006 Beschriftung: Drucker	Wert:727000023 Beschriftung: -Drucker 1000 Reihe - privat
		Wert:727000024 Beschriftung: -Farbdrucker 2000 Reihe - privat
		Wert:727000025 Beschriftung: -Drucker 9000 Reihe - freigegeben
		Wert:727000026 Beschriftung: -Farbdrucker 9000 Reihe - freigegeben
	Wert:727000007 Beschriftung: Telefon	Wert:727000027 Beschriftung: PSTN-Telefon
		Wert:727000028 Beschriftung: IP-Telefon
		Wert:727000029 Beschriftung: Mobiltelefon

Filterung aktivieren

Konvertieren Sie das gewünschte Filtern von Optionen in folgendes XML-Dokument und laden Sie es al eine XML-Webressource mit dem Titel sample_TicketDependentOptionSetConfig.xml herauf. Die Beschriftungswerte werden eingefügt, um das Bearbeiten des Dokuments zu vereinfachen, sie werden jedoch im Skript zum Filtern der Optionen nicht verwendet.


<DependentOptionSetConfig entity="sample_ticket" >
 <ParentField id="sample_category"
              label="Category">
  <DependentField id="sample_subcategory"
                  label="Sub Category" />
  <Option value="727000000"
          label="Software">
   <ShowOption value="727000000"
               label="Personal Productivity" />
   <ShowOption value="727000001"
               label="Business Applications" />
   <ShowOption value="727000002"
               label="Operating Systems" />
  </Option>
  <Option value="727000001"
          label="Hardware">
   <ShowOption value="727000003"
               label="Desktop Computer" />
   <ShowOption value="727000004"
               label="Laptop Computer" />
   <ShowOption value="727000005"
               label="Monitor" />
   <ShowOption value="727000006"
               label="Printer" />
   <ShowOption value="727000007"
               label="Telephone" />
  </Option>
 </ParentField>
 <ParentField id="sample_subcategory"
              label="Sub Category">
  <DependentField id="sample_type"
                  label="Type" />
  <Option value="727000000"
          label="Personal Productivity">
   <ShowOption value="727000000"
               label="Word Processor" />
   <ShowOption value="727000001"
               label="Spreadsheet" />
   <ShowOption value="727000002"
               label="Internet Browser" />
   <ShowOption value="727000003"
               label="E-mail" />
  </Option>
  <Option value="727000001"
          label="Business Applications">
   <ShowOption value="727000004"
               label="Customer Relationship Management" />
   <ShowOption value="727000005"
               label="Enterprise Resource Management" />
   <ShowOption value="727000006"
               label="Human Resource Managment" />
  </Option>
  <Option value="727000002"
          label="Operating Systems">
   <ShowOption value="727000007"
               label="Windows Vista" />
   <ShowOption value="727000008"
               label="Windows 7" />
   <ShowOption value="727000009"
               label="Windows Server 2003" />
   <ShowOption value="727000010"
               label="Windows Server 2008" />
  </Option>
  <Option value="727000003"
          label="Desktop Computer">
   <ShowOption value="727000011"
               label="Workstation x1000" />
   <ShowOption value="727000012"
               label="Workstation x2000" />
   <ShowOption value="727000013"
               label="Workstation x3000" />
   <ShowOption value="727000014"
               label="Workstation x4000" />
  </Option>
  <Option value="727000004"
          label="Laptop Computer">
   <ShowOption value="727000015"
               label="Laptop 1000 series" />
   <ShowOption value="727000016"
               label="Laptop 2000 series" />
   <ShowOption value="727000017"
               label="Laptop 3000 series" />
   <ShowOption value="727000018"
               label="Laptop 4000 series" />
  </Option>
  <Option value="727000005"
          label="Monitor">
   <ShowOption value="727000019"
               label="CRT-XYZ 17 inch" />
   <ShowOption value="727000020"
               label="LCD-XYZ 17 inch" />
   <ShowOption value="727000021"
               label="LCD-XYZ 21 inch" />
   <ShowOption value="727000022"
               label="LCD-XYZ 24 inch" />
  </Option>
  <Option value="727000006"
          label="Printer">
   <ShowOption value="727000023"
               label="Series 1000 Printer - Private" />
   <ShowOption value="727000024"
               label="Series 2000 Color Printer - Private" />
   <ShowOption value="727000025"
               label="Series 9000 Printer - Shared" />
   <ShowOption value="727000026"
               label="Series 9000 Color Printer - Shared" />
  </Option>
  <Option value="727000007"
          label="Telephone">
   <ShowOption value="727000027"
               label="PSTN Phone" />
   <ShowOption value="727000028"
               label="IP Phone" />
   <ShowOption value="727000029"
               label="Mobile Phone" />
  </Option>
 </ParentField>
</DependentOptionSetConfig>

Erstellen Sie eine JScript-Webressource namens sample_SDK.DependentOptionSetSample.js, indem Sie folgenden Code verwenden.



//If the SDK namespace object is not defined, create it.
if (typeof (SDK) == "undefined")
{ SDK = {}; }
// Create Namespace container for functions in this library;
SDK.DependentOptionSet = {};
SDK.DependentOptionSet.init = function (webResourceName) {
 //Retrieve the XML Web Resource specified by the parameter passed
 var clientURL = Xrm.Page.context.getClientUrl();

 var pathToWR = clientURL + "/WebResources/" + webResourceName;
 var xhr = new XMLHttpRequest();
 xhr.open("GET", pathToWR, true);
 xhr.setRequestHeader("Content-Type", "text/xml");
 xhr.onreadystatechange = function () { SDK.DependentOptionSet.completeInitialization(xhr); };
 xhr.send();
};
SDK.DependentOptionSet.completeInitialization = function (xhr) {
 if (xhr.readyState == 4 /* complete */) {
     if (xhr.status == 200) {
         xhr.onreadystatechange = null; //avoids memory leaks
   var JSConfig = [];
   var ParentFields = xhr.responseXML.documentElement.getElementsByTagName("ParentField");
   for (var i = 0; i < ParentFields.length; i++) {
    var ParentField = ParentFields[i];
    var mapping = {};
    mapping.parent = ParentField.getAttribute("id");
    mapping.dependent = SDK.Util.selectSingleNode(ParentField, "DependentField").getAttribute("id");
    mapping.options = [];
    var options = SDK.Util.selectNodes(ParentField, "Option");
    for (var a = 0; a < options.length; a++) {
     var option = {};
     option.value = options[a].getAttribute("value");
     option.showOptions = [];
     var optionsToShow = SDK.Util.selectNodes(options[a], "ShowOption");
     for (var b = 0; b < optionsToShow.length; b++) {
      var optionToShow = {};
      optionToShow.value = optionsToShow[b].getAttribute("value");
      optionToShow.text = optionsToShow[b].getAttribute("label");
      option.showOptions.push(optionToShow);
     }
     mapping.options.push(option);
    }
    JSConfig.push(mapping);
   }
   //Attach the configuration object to DependentOptionSet
   //so it will be available for the OnChange events 
   SDK.DependentOptionSet.config = JSConfig;
   //Fire the onchange event for the mapped optionset fields
   // so that the dependent fields are filtered for the current values.
   for (var depOptionSet in SDK.DependentOptionSet.config) {
    var parent = SDK.DependentOptionSet.config[depOptionSet].parent;
    Xrm.Page.data.entity.attributes.get(parent).fireOnChange();
   }
  }
 }
};
 // This is the function set on the onchange event for 
 // parent fields
SDK.DependentOptionSet.filterDependentField = function (parentField, childField) {
 for (var depOptionSet in SDK.DependentOptionSet.config) {
  var DependentOptionSet = SDK.DependentOptionSet.config[depOptionSet];
  /* Match the parameters to the correct dependent optionset mapping*/
  if ((DependentOptionSet.parent == parentField) &amp;&amp; (DependentOptionSet.dependent == childField)) {
   /* Get references to the related fields*/
   var ParentField = Xrm.Page.data.entity.attributes.get(parentField);
   var ChildField = Xrm.Page.data.entity.attributes.get(childField);
   /* Capture the current value of the child field*/
   var CurrentChildFieldValue = ChildField.getValue();
   /* If the parent field is null the Child field can be set to null */
   if (ParentField.getValue() == null) {
    ChildField.setValue(null);
    ChildField.setSubmitMode("always");
    ChildField.fireOnChange();

    // Any attribute may have any number of controls
    // So disable each instance
    var controls = ChildField.controls.get()

    for (var ctrl in controls) {
     controls[ctrl].setDisabled(true);
    }
    return;
   }

   for (var os in DependentOptionSet.options) {
    var Options = DependentOptionSet.options[os];
    var optionsToShow = Options.showOptions;
    /* Find the Options that corresponds to the value of the parent field. */
    if (ParentField.getValue() == Options.value) {
     var controls = ChildField.controls.get();
     /*Enable the field and set the options*/
     for (var ctrl in controls) {
      controls[ctrl].setDisabled(false);
      controls[ctrl].clearOptions();

      for (var option in optionsToShow) {
       controls[ctrl].addOption(optionsToShow[option]);
      }

     }
     /*Check whether the current value is valid*/
     var bCurrentValueIsValid = false;
     var ChildFieldOptions = optionsToShow;

     for (var validOptionIndex in ChildFieldOptions) {
      var OptionDataValue = ChildFieldOptions[validOptionIndex].value;

      if (CurrentChildFieldValue == OptionDataValue) {
       bCurrentValueIsValid = true;
       break;
      }
     }
     /*
     If the value is valid, set it.
     If not, set the child field to null
     */
     if (bCurrentValueIsValid) {
      ChildField.setValue(CurrentChildFieldValue);
     }
     else {
      ChildField.setValue(null);
     }
     ChildField.setSubmitMode("always");
     ChildField.fireOnChange();
     break;
    }
   }
  }
 }
};

SDK.Util = {};
//Helper methods to merge differences between browsers for this sample
 SDK.Util.selectSingleNode = function (node, elementName) {
  if (typeof (node.selectSingleNode) != "undefined") {
   return node.selectSingleNode(elementName);
  }
  else {
   return node.getElementsByTagName(elementName)[0];
  }
 };
 SDK.Util.selectNodes = function (node, elementName) {
  if (typeof (node.selectNodes) != "undefined") {
   return node.selectNodes(elementName);
  }
  else {
   return node.getElementsByTagName(elementName);
  }
 };

Fügen Sie die sample_SDK.DependentOptionSetSample.js-Skriptwebressource den JScript - Bibliotheken hinzu, die für das Formular verfügbar sind.
Konfigurieren Sie den Ereignishandler im Onload-Ereignis für das Formular so, dass die Funktion SDK.DependentOptionSet.init aufgerufen und im Namen der XML-Webressource als ein Parameter übergeben wird. Verwenden Sie das Feld im Dialogfeld Handlereigenschaften, um folgendes in das Feld Durch Trennzeichen getrennte Liste mit Parametern, die an die Funktion weitergegeben werden einzugeben: "sample_TicketDependentOptionSetConfig.xml".
Im OnChange-Ereignis für das Kategorie-Feld, legen Sie die Funktion auf SDK.DependentOptionSet.filterDependentField fest.

Geben Sie im Textfeld Durch Kommata getrennten Liste mit Parametern, die an die Funktion weitergegeben werden"sample_category", "sample_subcategory" ein.
Im OnChange-Ereignis für das Unterkategorie-Feld, legen Sie die Funktion auf SDK.DependentOptionSet.filterDependentField fest.

Geben Sie im Textfeld Durch Kommata getrennten Liste mit Parametern, die an die Funktion weitergegeben werden"sample_subcategory ", "sample_type" ein.
Speichern und veröffentlichen Sie alle Anpassungen.

Siehe auch

Verwenden des Xrm.Page-Objektmodells
Schreiben von Code für Microsoft Dynamics CRM 2015-Formulare
Verwendung von JavaScript mit Microsoft Dynamics CRM 2015
Anpassen von Entitätsformularen
Xrm.Page.data.entity-Attribut (clientseitige Referenz)
Xrm.Page.ui-Steuerelement (clientseitige Referenz)

Freigeben über

Beispiel: Erstellen eines abhängigen OptionSets-Elements (Auswahllisten)

Ziele für diese Lösung

Beispiel

Filterung aktivieren

Siehe auch

Zusätzliche Ressourcen