教學課程：將規則套用至最適化表單欄位

本教學課程是 建立第一個最適化表單 數列。 Adobe建議依照時間順序觀看本系列，以瞭解、執行和示範完整的教學課程使用案例。

關於教學課程

您可以使用規則將互動、商業邏輯和智慧驗證新增至最適化表單。 調適型表單有內建規則編輯器。 規則編輯器提供拖放功能，類似於引導式導覽。 拖放方法是最快速且最簡單的規則建立方法。 規則編輯器還為有興趣測試其編碼技能或將規則提升到更高層級的使用者提供了一個代碼視窗。

如需規則編輯器的詳細資訊，請參閱 最適化Forms規則編輯器.

在本教學課程結束時，您將瞭解如何建立規則來：

• 叫用表單資料模型服務以從資料庫擷取資料
• 叫用表單資料模型服務以將資料新增至資料庫
• 執行驗證檢查並顯示錯誤訊息

教學課程每個區段末尾的互動式GIF影像可協助您快速學習及驗證所建置表單的功能。

步驟1：從資料庫擷取客戶記錄

您已遵循下列步驟建立表單資料模型 建立表單資料模型 文章。 現在，您可以使用規則編輯器來叫用Forms資料模型服務，以擷取資訊並新增至資料庫。

每個客戶都會獲派一個唯一的客戶ID號碼，這有助於識別資料庫中的相關客戶資料。 下列程式會使用客戶ID從資料庫擷取資訊：

1. 開啟最適化表單進行編輯。

   http://localhost:4502/editor.html/content/forms/af/change-billing-shipping-address.html

2. 點選 客戶ID 欄位並點選 編輯規則 圖示。 「規則編輯器」視窗隨即開啟。

3. 點選 +建立 圖示以新增規則。 它會開啟視覺化編輯器。

   在視覺化編輯器中， 時間 陳述式預設為選取。 此外，表單物件(在此案例中， 客戶ID)啟動規則編輯器的位置，會於 時間 陳述式。

4. 點選 選取狀態 下拉式清單並選取 已變更.

   

5. 在 則 陳述式，選取 啟動服務 從 選取動作 下拉式清單。

6. 選取 擷取送貨地址 服務來自 選取 下拉式清單。

7. 拖放 客戶ID 欄位(從「表單物件」標籤到 拖放物件或在這裡選取 中的欄位 輸入 方塊。

   

8. 拖放 客戶ID、名稱、送貨地址、州/省和郵遞區號 欄位(從「表單物件」標籤到 拖放物件或在這裡選取 中的欄位 輸出 方塊。

   

   點選 完成 以儲存規則。 在規則編輯器視窗上，點選 關閉.

9. 預覽最適化表單。 在中輸入ID 客戶ID 欄位。 表單現在可以從資料庫擷取客戶詳細資訊。

   

步驟2：將更新的客戶地址新增至資料庫

從資料庫擷取客戶詳細資料後，您可以更新送貨地址、州別和郵遞區號。 下列程式會叫用「表單資料模型」服務，將客戶資訊更新至資料庫：

1. 選取 提交 欄位並點選 編輯規則 圖示。 「規則編輯器」視窗隨即開啟。

2. 選取 提交 — 按一下 規則，然後點選 編輯 圖示。 隨即顯示編輯「提交」規則的選項。

   

   在WHEN選項中， 提交 和 已點按 已選取選項。

   

3. 在 則 選項，點選 +新增陳述式 選項。 選取 啟動服務 從 選取動作 下拉式清單。

4. 選取 更新送貨地址 服務來自 選取 下拉式清單。

   

   

5. 拖放 送貨地址、州/省和郵遞區號 欄位來自 表單物件 定位字元至的相應tablename .property （例如customerdetails .shippingAddress）。 拖放物件或在這裡選取 中的欄位 輸入 方塊。 所有以tablename為前置詞的欄位（例如，此使用案例中的customerdetails）都會當作更新服務的輸入資料。 這些欄位中提供的所有內容都會在資料來源中更新。

   注意

   請勿拖放 名稱 和 客戶ID 至對應tablename.property的欄位（例如customerdetails.name）。 它有助於避免錯誤地更新客戶的名稱和ID。

6. 拖放 客戶ID 欄位來自 表單物件 標籤切換至中的id欄位 輸入 方塊。 沒有前置詞tablename的欄位（例如，此使用案例中的customerdetails）會作為更新服務的搜尋引數。 此 id 此使用案例中的欄位可唯一識別中的記錄 customerdetails 表格。

7. 點選 完成 以儲存規則。 在規則編輯器視窗上，點選 關閉.

8. 預覽最適化表單。 擷取客戶的詳細資料、更新送貨地址並提交表單。 當您再次擷取相同客戶的詳細資料時，會顯示更新的送貨地址。

步驟3： （額外章節）使用程式碼編輯器執行驗證並顯示錯誤訊息

您應該對表單執行驗證，以確保在表單中輸入的資料正確無誤，並且在資料不正確的情況下會顯示錯誤訊息。 例如，如果在表單中輸入不存在的客戶ID，則會顯示錯誤訊息。

適用性表單提供數個內建驗證的元件，例如電子郵件和數值欄位，您可將其用於常見使用案例。 針對進階使用案例使用規則編輯器，例如在資料庫傳回零(0)記錄（無記錄）時顯示錯誤訊息。

下列程式說明如果表單中輸入的客戶ID不存在於資料庫中，如何建立規則以顯示錯誤訊息。 此規則也會將焦點導向並重設 客戶ID 欄位。 規則使用 表單資料模型服務的dataIntegrationUtils API 檢查客戶ID是否存在於資料庫中。

1. 點選 客戶ID 欄位並點選 Edit Rules 圖示。 此 規則編輯器 視窗隨即開啟。

2. 點選 +建立 圖示以新增規則。 它會開啟視覺化編輯器。

   在視覺化編輯器中， 時間 陳述式預設為選取。 此外，表單物件(在此案例中， 客戶ID)啟動規則編輯器的位置，會於 時間 陳述式。

3. 點選 選取狀態 下拉式清單並選取 已變更.

   

   在 則 陳述式，選取 啟動服務 從 選取動作 下拉式清單。

4. 切換來源 視覺化編輯器 至 代碼編輯器. 切換器控制項位於視窗的右側。 程式碼編輯器隨即開啟，顯示類似下列的程式碼：

   

5. 以下列程式碼取代輸入變數區段：

   var inputs = {
       "id" : this
   };
   

6. 取代 guidelib.dataIntegrationUtils.executeOperation (operationInfo, inputs, outputs) 區段，代碼如下：

   guidelib.dataIntegrationUtils.executeOperation(operationInfo, inputs, outputs, function (result) {
     if (result) {
         result = JSON.parse(result);
       customer_Name.value = result.name;
       customer_Shipping_Address = result.shippingAddress;
     } else {
       if(window.confirm("Invalid Customer ID. Provide a valid customer ID")) {
             customer_Name.value = " ";
            guideBridge.setFocus(customer_ID);
       }
     }
   });
   

7. 預覽最適化表單。 輸入不正確的客戶ID。 出現錯誤訊息。

   

Business.Adobe.com 資源

Ecommerce Integrations Personalized Communications Embedded Charts Managed Cloud Content Management Digital Asset Management