將驗證套用至小器具
您可使用驗證來檢查使用者可以在混搭內鍵入或選取的資料。驗證可讓您核對所提供資料的格式是否正確，以及是否符合您應用程式的預期需求。一些輸入可能是必要的，而其他一些輸入則必須符合特定格式，例如電話號碼或電子郵件地址。通常，會先在用戶端執行簡單驗證，然後再將資料提交至伺服器。但是，您可以使用事件與服務來在伺服器端執行進階驗證。您可透過下列方式，使用驗證來改善混搭的使用者體驗：
• 使用正確的格式收集資料。資料遺失或格式錯誤時，資料服務與函數可能無法正常運作。
• 透過確保只在伺服器上儲存有效且安全的資料，來保護使用者資料。
• 防止混搭遭受惡意資料的破壞，因為這可能會導致應用程式受損。
驗證成功時，應用程式可讓使用者將輸入提交至伺服器。驗證失敗時，會顯示失敗訊息，使用者可以修正輸入，然後再試一次。您可以使用小器具與樣式內容來配置文字、圖示以及條件、成功與失敗訊息的樣式。在 ThingWorx 9.3.4 或更新版本中，下列小器具支援輸入驗證：
• 文字欄位
• 文字區域
• 日期選擇器
• 下拉清單
• 核取方塊
• 滑桿
• 檔案上載
• 格點
如需有關將驗證套用至「格點」小器具的詳細資訊，請參閱驗證格點內的輸入。
當您在設計時間選取其中一個列出的輸入小器具時，其驗證內容會列在「驗證」面板上。下圖顯示了「文字欄位」小器具的內容。您可以配置驗證內容，例如 MaxLength 與 MinLength 訊息。
最佳實務
• 請確保小器具有足夠的空間來在版面配置中顯示驗證訊息。在太小的小器具上設定固定高度可能會影響訊息的可見度。建議將高度設定為自動調整大小。
配置驗證內容
您可以使用可用的驗證內容來執行下列組態：
• 使用 ValidationState 內容以程式設計方式將驗證狀態設定為下列其中一個值：
◦ Undefined - 禁用驗證時 (預設)
◦ Unvalidated - 未觸發驗證時
◦ Valid - 驗證成功時
◦ Invalid - 驗證失敗時
• 使用 Validate 事件，於小器具資料變更時，觸發功能的驗證服務。
• 使用 ValidationOutput 內容擷取驗證狀態。
• 控制條件、失敗、成功與所需值訊息的可見度、文字與圖示。
• 使用 ValueRequired 內容控制是否需要為小器具指定值。
此外，每個小器具還存在特有的其他內容。例如，您可以為「文字區域」小器具設定最大與最小支援的字元數。
 |
每個小器具的完整內容清單會列在小器具主題中。
|
驗證資料的方法有兩種：
• 即時 - 使用即時驗證時，會在使用者輸入資料時檢查資料。您可以使用此方法，在使用者鍵入資料時為其提供回饋。例如，您可以使用 Changed 或 EnterKeyPressed 事件驗證是否在「文字欄位」小器具中鍵入了特殊字元。此類型的驗證不需要連線至伺服器，通常會在用戶端執行。
• 明確 - 在使用者動作的回應中驗證資料，例如按一下提交按鈕或使用連結導覽至其他頁面。發生此類事件時，您可以執行會針對 ValidationState 內容傳回 Valid 或 Invalid 值的驗證服務。您可以使用此類型的驗證來執行伺服器端驗證，這比用戶端驗證會花費更多的時間。
套用用戶端驗證
您可以使用此類型的驗證來套用在瀏覽器中套用的驗證規則。使用用戶端驗證可透過讓使用者在將資料提交至伺服器之前修正格式問題，來改善應用程式的使用體驗。用戶端驗證也比伺服器端驗證速度更快。您可以套用用戶端驗證時的範例如下：
• 檢查必填欄位是否必須包含資料。
• 檢查郵遞區號或電子郵件地址格式
• 驗證特殊字元或序列
您可以使用例如「驗證器」與「運算式」函數這類的函數來在將資料傳送至伺服器之前，先在用戶端驗證資料。
套用伺服器端驗證
使用用戶端驗證無法保證輸入資料有效且安全。欲執行進階驗證，請使用伺服器端驗證服務。在下列情況下，您應該在伺服器端與用戶端都驗證提交的資料：
• 當驗證存取以伺服器為基礎的資料，或者當需要大量資料來執行驗證時。例如，當使用者存取資料庫以檢查是否可在請求表單中訂購機器零件時。在這種情況下使用用戶端驗證需要下載大量資料，這可能會影響效能。
• 當使用敏感性資料時。套用用戶端驗證無法保證安全性。使用者仍可將不正確或惡意的資料提交至伺服器。請確保先審查所有輸入資料，再將其傳送至伺服器。
以下是伺服器端驗證使用案例的範例：
• 檢查新機器零件的 ID 是否具唯一性且尚不存在。
• 檢查遠端物件名稱是否存在。
• 檢查電子郵件地址是否存在。
• 檢查使用者是否擁有執行任務所需的權限。
將驗證套用至小器具
欲將驗證套用至小器具，請執行下列步驟：
1. 在 Mashup Builder 中，選取畫布上的輸入小器具或使用「檔案總管」面板。
2. 在「驗證」面板上，定義驗證條件與訊息：
◦ 欲需要值，請將 ValueRequired 內容設定為 true。您可以使用 RequiredMessage 內容自訂要顯示的訊息。
◦ 配置條件、失敗與成功訊息，以通知使用者相關驗證需求與結果。
3. 或者，將小器具 ValidationState 內容繫結至函數或資料服務。
4. 根據您要執行的驗證類型，將 Validate 事件繫結至函數或資料服務。
◦ 欲執行用戶端驗證，請使用函數。
◦ 欲執行伺服器端驗證，請使用資料服務。
5. 按一下「儲存」，然後檢視混搭。
會在執行時間將驗證套用至小器具。
自訂驗證訊息
您可以在支援驗證的小器具內顯示下列類型的訊息：
• 條件 - 在套用驗證之前顯示。
• 失敗 - 驗證失敗時顯示
• 成功 - 驗證成功時顯示
• 必要 - 當所需值遺失時顯示
|
|
某些小器具 (例如「文字欄位」) 包含內建驗證內容的特定訊息。如需有關每個小器具之可用內容的詳細資訊，請參閱小器具主題。
|
您可以顯示條件訊息，以通知使用者小器具的所需資料格式與套用的驗證規則。欲顯示條件訊息，請將 ShowValidationCriteria 內容設定為 true。
1. ValidationCriteriaIcon - 設定用於條件訊息的圖示。
2. CriteriaMessage - 設定要顯示在條件圖示旁邊的條件訊息。
3. CriteriaMessageDetails - 要顯示之有關驗證條件的其他詳細資訊。
欲在驗證失敗時顯示條件訊息，請將 ShowFailureMessage 內容設定為 true。
訊息與條件狀態的詳細資訊也會針對失敗狀態顯示。欲設定失敗狀態的特定圖示，請使用 ValidationFailureIcon 內容。
您可以顯示成功訊息，以確認重要動作或任務的資料或選取有效。欲顯示成功訊息，請將 ShowValidationSuccess 內容設定為 true。在執行時間，當將 Valid 內容值設定為 ValidationState 時，會顯示成功訊息。
1. ValidationSuccessIcon - 設定顯示在成功訊息內的圖示。
2. SuccessMessage - 設定要針對驗證狀態顯示的訊息。
3. SuccessMessageDetails - 要顯示之有關驗證成功的其他詳細資訊。
當所需值遺失或未選取時，您可以使用 RequiredMessage 內容來顯示訊息。下列範例顯示了當未選取「核取方塊」小器具時所顯示的失敗訊息。
在此範例中，TrueRequired 與 ShowValidationFailure 內容已啟用。您可以使用 ShowValidationCriteria 與 CriteriaMessage 內容來指示必須進行選取。
當多個驗證失敗時，失敗訊息會顯示在清單中。在下列範例中，滑桿驗證失敗，因為範圍中的第一個值低於最小值，第二個值高於允許的最大值。
設定驗證訊息樣式
依預設，會使用紅色、綠色及藍色反白顏色來為成功、失敗與條件訊息設定樣式。您可以自訂混搭樣式主題中的驗證樣式：
1. 在 Composer 中開啟樣式主題實體。
2. 在「樣式」標籤的「全域」下，展開 >
3. 編輯「成功」與「危險」顏色的值。
4. 儲存樣式主題的變更，並在混搭中預覽變更。
您也可以使用小器具樣式內容來在「樣式內容」面板上為每一種狀態的字型、顏色與背景顏色設定樣式。
1. 在 Mashup Builder 中，選取支援的輸入小器具。
2. 在「樣式內容」面板上，展開驗證狀態，例如 Valid。可用部份即會列出。
| | 「日期時間選擇器」小器具的樣式內容會列在「基礎」狀態下。 |
3. 展開一或多個部份，然後編輯可用樣式內容。
4. 按一下「儲存」，然後按一下「檢視混搭」。套用驗證時，樣式現在即會顯示。