分享方式:


範例:建立相依 OptionSets (挑選清單)

 

發佈日期: 2016年11月

適用對象: Dynamics CRM 2015

一個選項組欄位的值必須由其他選項組欄位中選取的值篩選,是一般需求。 本主題描述使用可重複使用的 JScript 程式庫、表單事件和 XML Web 資源,達成此需求的一個方法。

若要查看和驗證此範例功能,從 SDK 下載檔案的下列位置安裝 DependentOptionSetsSample_1_0_0_2_managed.zip 受管理的解決方案:SDK\SampleCode\JS\FormScripts

下載 Microsoft Dynamics CRM SDK 套件。

此解決方案的目標

此解決方案設計用來符合下列需求:

  • 它提供可用於所有一對選項組欄位使用的一般、可重複使用的 JScript 程式庫。

  • 它允許相依選項組欄位的鏈結。 因為每個相依選項組欄位的選項是根據另一個欄位值篩選,其他選項組欄位選項可以依第一個相依選項組欄位選取的選項篩選。 這允許一組階層式相依選項組欄位的可能性。

  • 相依選項篩選是在 XML Web 資源中設定。 這允許變更選項對應,無需變更程式碼。 編輯 Web XML 資源變得更輕鬆,非開發人員可以設定選項,破壞程式碼的機會降低。

  • 解決方案支援多種語言。 篩選完全是根據選項的資料值,不是選擇性的所有文字。

  • 篩選適用於表單上任意數目的屬性控制項執行個體。

範例

本節描述此方法的應用程式和套用範例程式庫的程序。

Ticket (sample_ticket) 實體表單具有允許產品分類的三個選項組欄位和選項。 下表顯示預期選項組選項篩選。

類別

(sample_category)

子類別

(sample_subcategory)

類型​​

(sample_type)

值:727000000 標籤:Software

值:727000000 標籤:Personal Productivity

值:727000000 標籤:Word Processor

值:727000001 標籤:Spreadsheet

值:727000002 標籤:Internet Browser

值:727000003 標籤:E-mail

值:727000001 標籤:Business Applications

值:727000004 標籤:Customer Relationship Management

值:727000005 標籤:Enterprise Resource Management

值:727000006 標籤:Human Resource Management

值:727000002 標籤:Operating Systems

值:727000007 標籤:Windows Vista

值:727000008 標籤:Windows 7

值:727000009 標籤:Windows Server 2003

值:727000010 標籤:Windows Server 2008

值:727000001 標籤:Hardware

值:727000003 標籤:Desktop Computer

值:727000011 標籤:Workstation x1000

值:727000012 標籤:Workstation x2000

值:727000013 標籤:Workstation x3000

值:727000014 標籤:Workstation x4000

值:727000004 標籤:Laptop Computer

值:727000015 標籤:Laptop 1000 series

值:727000016 標籤:Laptop 2000 series

值:727000017 標籤:Laptop 3000 series

值:727000018 標籤:Laptop 4000 series

值:727000005 標籤:Monitor

值:727000019 標籤:CRT-XYZ 17 inch

值:727000020 標籤:LCD-XYZ 17 inch

值:727000021 標籤:LCD-XYZ 21 inch

值:727000022 標籤:LCD-XYZ 24 inch

值:727000006 標籤:Printer

值:727000023 標籤:Series 1000 Printer - Private

值:727000024 標籤:Series 2000 Color Printer - Private

值:727000025 標籤:Series 9000 Printer - Shared

值:727000026 標籤:Series 9000 Color Printer - Shared

值:727000007 標籤:Telephone

值:727000027 標籤:PSTN Phone

值:727000028 標籤:IP Phone

值:727000029 標籤:Mobile Phone

啟用篩選

  1. 將預期選項篩選轉換成下列 XML 文件,並上傳為 XML Web 資源,名稱為 sample_TicketDependentOptionSetConfig.xml。 標籤值包括是為了讓文件容易編輯,但無法用於篩選選項的指令碼。

    
    <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>
    
  2. 使用下列程式碼,建立名為 sample_SDK.DependentOptionSetSample.js 的 JScript Web 資源。

    
    
    //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);
      }
     };
    
  3. 新增 sample_SDK.DependentOptionSetSample.js 指令碼 Web 資源至表單可用的 JScript 程式庫。

  4. 在表單的 Onload 事件,請設定事件處理常式呼叫 SDK.DependentOptionSet.init 函數並傳入 XML Web 資源的名稱做為參數。 在 [處理常式屬性] 對話方塊的 [以逗點分隔的參數清單,其會傳送至函數] 欄位中輸入:"sample_TicketDependentOptionSetConfig.xml"。

  5. 在 [類別] 的 OnChange 事件中,將 [函數] 設為 SDK.DependentOptionSet.filterDependentField

    在 [以逗點分隔的參數清單,其會傳送至函數] 文字方塊中,輸入:"sample_category", "sample_subcategory"。

  6. 在 [子類別] 的 OnChange 事件中,將 [函數] 設為 SDK.DependentOptionSet.filterDependentField

    在 [以逗點分隔的參數清單,其會傳送至函數] 文字方塊中,輸入:"sample_subcategory ", "sample_type"。

  7. 儲存並發行所有自訂。

另請參閱

使用 Xrm.Page 物件模型
撰寫 Microsoft Dynamics CRM 2015 表單的程式碼
使用 JavaScript 搭配 Microsoft Dynamics CRM 2015
自訂實體表單
Xrm.Page.data.entity 屬性 (用戶端參考)
Xrm.Page.ui 控制項 (用戶端參考)

© 2017 Microsoft. 著作權所有,並保留一切權利。 著作權