Voorbeeld: Afhankelijke OptionSets maken (selectielijsten)

Artikel
07/06/2017

Gepubliceerd: november 2016

Is van toepassing op: Dynamics CRM 2015

Het is een veelvoorkomende vereiste dat de waarden in één optiesetveld moeten worden gefilterd op een waarde die wordt gekozen in een ander optiesetveld. In dit onderwerp wordt een methode beschreven om dit te doen met een herbruikbare JScript-bibliotheek, formuliergebeurtenissen en een XML-webresource.

Als u de functionaliteit van dit voorbeeld wilt bekijken en controleren, kunt u de beheerde oplossing DependentOptionSetsSample_1_0_0_2_managed.zip installeren vanaf de volgende locatie in de SDK-download: SDK\SampleCode\JS\FormScripts

Download het Microsoft Dynamics CRM SDK-pakket.

Doelstellingen voor deze oplossing

Deze oplossing is bedoeld om aan de volgende vereisten te voldoen:

Dit biedt een algemene, herbruikbare JScript-bibliotheek die kan worden gebruikt voor elk paar optiesetvelden.
Het zorgt voor een ketting van afhankelijke optiesetvelden. Omdat de opties van elk afhankelijk optiesetveld worden gefilterd op basis van de waarde van een ander veld, kunnen aanvullende optiesetveldopties worden gefilterd door de gekozen optie in het eerste afhankelijke optiesetveld. Hierdoor is een set hiërarchisch afhankelijke optiesetvelden mogelijk.
Het filteren van afhankelijke opties is ingesteld in een XML webresource. Dit zorgt voor het wijzigen van de optietoewijzingen zonder de code te wijzigen. Een XML webresource bewerken is gemakkelijker voor een niet-ontwikkelaar om opties in te stellen met minder mogelijkheden om de code te breken.
De oplossing ondersteunt meerdere talen. Het filteren is uitsluitend gebaseerd op de gegevenswaarde van de opties en niet op tekst in de opties.
Filteren werkt voor elk willekeurig aantal exemplaren van een kenmerkbesturingselement op het formulier.

Voorbeeld

In dit gedeelte wordt een toepassing beschreven van deze methode en de procedure om de voorbeeldbibliotheek toe te passen.

Het entiteitformulier Ticket (sample_ticket) heeft drie optiesetvelden en opties waardoor categoriseren van producten mogelijk is. De onderstaande tabel toont de gewenste filtering van optiesetopties.

Categorie (sample_category)	Subcategorie (sample_subcategory)	Type (sample_type)
Waarde:727000000 Label: Software	Waarde:727000000 Label: Persoonlijke productiviteit	Waarde:727000000 Label: Tekstverwerker
		Waarde:727000001 Label: Rekenblad
		Waarde:727000002 Label: Internetbrowser
		Waarde:727000003 Label: E-mail
	Waarde:727000001 Label: Bedrijfstoepassingen	Waarde:727000004 Label: Beheer klantrelaties
		Waarde:727000005 Label: Beheer bedrijfsmiddelen
		Waarde:727000006 Label: Personeelsbeheer
	Waarde:727000002 Label: Besturingssystemen	Waarde:727000007 Label: Windows Vista
		Waarde:727000008 Label: Windows 7
		Waarde:727000009 Label: Windows Server 2003
		Waarde:727000010 Label: Windows Server 2008
Waarde:727000001 Label: Hardware	Waarde:727000003 Label: Desktopcomputer	Waarde:727000011 Label: Workstation x1000
		Waarde:727000012 Label: Workstation x2000
		Waarde:727000013 Label: Workstation x3000
		Waarde:727000014 Label: Workstation x4000
	Waarde:727000004 Label: Laptopcomputer	Waarde:727000015 Label: Laptop 1000-reeks
		Waarde:727000016 Label: Laptop 2000-reeks
		Waarde:727000017 Label: Laptop 3000-reeks
		Waarde:727000018 Label: Laptop 4000-reeks
	Waarde:727000005 Label: Monitor	Waarde:727000019 Label: CRT-XYZ 17 inch
		Waarde:727000020 Label: LCD-XYZ 17 inch
		Waarde:727000021 Label: LCD-XYZ 21 inch
		Waarde:727000022 Label: LCD-XYZ 24 inch
	Waarde:727000006 Label: Printer	Waarde:727000023 Label: Printer 1000-reeks - persoonlijk
		Waarde:727000024 Label: Kleurenprinter 2000-reeks - persoonlijk
		Waarde:727000025 Label: Printer 9000-reeks - gedeeld
		Waarde:727000026 Label: Kleurenprinter 9000-reeks - gedeeld
	Waarde:727000007 Label: Telefoon	Waarde:727000027 Label: PSTN-telefoon
		Waarde:727000028 Label: IP-telefoon
		Waarde:727000029 Label: Mobiele telefoon

Filteren inschakelen

Converteer de gewenste filtering van opties in het volgende XML document en upload het als een XML webresource met de titel sample_TicketDependentOptionSetConfig.xml. De labelwaarden worden opgenomen om het document gemakkelijker te bewerken te maken, maar worden niet gebruikt in het script dat de opties filtert.


<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>

Een JScript webresource maken met de naam sample_SDK.DependentOptionSetSample.js met de volgende code.



//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);
  }
 };

Voeg de sample_SDK.DependentOptionSetSample.js Scriptwebresource toe aan de JScript bibliotheken beschikbaar voor het formulier.
Configureer in de gebeurtenis Onload voor het formulier de gebeurtenishandler om de functie SDK.DependentOptionSet.init aan te roepen en geef de naam van de webresource XML door als parameter. Gebruik het veld in het dialoogvenster Handlereigenschappen om "sample_TicketDependentOptionSetConfig.xml" in te voeren in het veld Door komma's gescheiden lijst met parameters die worden doorgestuurd naar de functie.
Stel in de gebeurtenis OnChange voor het veld Categorie de functie Functie in op SDK.DependentOptionSet.filterDependentField.

Voer in het tekstvak Door komma's gescheiden lijst met parameters die worden doorgegeven aan de functie het volgende in: "sample_category", "sample_subcategory".
Stel in de gebeurtenis OnChange voor het veld Subcategorie de Functie in op SDK.DependentOptionSet.filterDependentField.

Voer in het tekstvak Door komma's gescheiden lijst met parameters die worden doorgegeven aan de functie het volgende in: "sample_subcategory ", "sample_type".
Alle aanpassingen opslaan en publiceren.

Zie ook

Het objectmodel Xrm.Page gebruiken
Code schrijven voor Microsoft Dynamics CRM 2015-formulieren
JavaScript gebruiken met Microsoft Dynamics CRM 2015
Entiteitformulieren aanpassen
Xrm.Page.data.entity attribute (clientreferentie)
Xrm.Page.ui control (referentie aan de clientzijde)

Delen via

Voorbeeld: Afhankelijke OptionSets maken (selectielijsten)

Doelstellingen voor deze oplossing

Voorbeeld

Filteren inschakelen

Zie ook

Aanvullende resources