自適應表單核心元件 adaptive-forms-core-components-introduction
使用 Adobe Experience Manager 中的自適應表單核心元件，您可以創造吸引人的註冊體驗。
核心元件 overview
在 Adobe Experience Manager (AEM) 中，元件是用來建立頁面和表單的建構區塊。它們為作者提供簡單且強大的方式來建立和管理內容，同時為開發人員提供建立自訂元件所需的彈性和擴充性。這些設定可加快開發時間，並降低網站與表單的維護成本、靈活性高且可輕鬆自訂，以符合網站與表單的特定需求。
核心元件也設計為可快速回應，並支援各種裝置，包括桌上型電腦、平板電腦和智慧型手機。此外，也遵循最新的網頁標準與最佳做法，使其成為建立網頁內容的強大可靠解決方案。
整體而言，核心元件是在 AEM 中建立及管理網頁內容的重要工具，提供強大且彈性的解決方案，有助於減少開發時間及維護成本，同時為網站訪客提供絕佳的使用者體驗。
自適應表單核心元件
自適應表單核心元件是以 Adobe Experience Manager WCM 核心元件為基礎所建立的 30 個開放原始碼且符合 BEM 的元件集。這些元件專為建立自適應表單所設計，而此類表單可根據使用者的裝置、瀏覽器和螢幕大小自動調整。
這些元件可用來創造優異的資料擷取和註冊體驗，方法是提供各式各樣的表單欄位選項，包括文字欄位、核取方塊、下拉式選單等。它們也包含驗證、條件式邏輯和回應式設計等功能，可用來建立簡單易用的表單。
此外，由於這些元件是開放原始碼，開發人員可輕鬆自訂和擴充元件，以符合其組織的特定需求。而且，這些元件是以 BEM 方法建置的，可確保它們具有可擴充性和可維護性。
功能 features
優點 benefits
資料擷取體驗對於潛在客戶產生和註冊至關重要，而自適應表單核心元件為建立針對資料擷取最佳化的表單提供強大的解決方案。使用核心元件而非基礎元件來建立這些體驗的部分原因包括：
-
GitHub 上的可用性：AEM 自適應表單核心元件是開放原始碼，可在 GitHub 上取得，並提供完整文件。如此一來，開發人員就能更輕鬆了解元件及其運作方式，且更能協助開發工作。aemcomponents.dev 網站也是寶貴的資源，開發人員可在此檢視運作中的元件，並存取詳細文件。
-
樣式的 BEM 模型：核心元件遵循 BEM (區塊元素修飾元) 模型來設定樣式，這是一套建立完善且廣泛使用的 CSS 組織方法。如此一來，開發人員就能更輕鬆了解樣式的組織方式，以及如何修改樣式，以符合其特定需求。
-
對第三方程式庫沒有相依性：核心元件的優點之一，就是它們對第三方 JavaScript 程式庫 (包括 JQuery 和 Underscore) 沒有相依性。這可讓元件更快且更輕量，以及更輕鬆地整合至現有的 AEM 實施。
-
著重於效能與協助工具：核心元件建置時已考慮到效能與協助工具，這反映在它們的 Google Lighthouse 和網頁指標分數上。這可讓開發人員更輕鬆地建立可存取且高效能的網頁，而這在現今的數位環境中日益重要。
-
Sites 30 個範本和主題的表單元件：核心元件支援 Sites 30 個範本和主題的表單元件，讓開發人員更容易在 AEM 中建立和自訂表格。
-
樣式更簡單：核心元件的樣式比基礎元件的樣式更簡單。佈景主題建立流程類似於 Sites，可從上層 Sites 頁面繼承相同主題/CSS。此外，樣式的 BEM 模型可讓您更容易理解及修改樣式。
-
協助工具：自適應表單核心元件支援協助工具標準和指南，以確保身心障礙使用者 (包括使用輔助技術 (例如螢幕助讀程式) 的使用者) 可以使用表格。
-
版本設定：您可以建立並管理多個以核心元件為基礎的自適應表單版本，透過留言功能參與合作討論，並可針對特定表單元件附上註解，藉此提升整體表單建置體驗。
可用元件：依元件類型劃分
AEM Forms 的目前版本有下列核心元件、基礎元件，和表單區塊元件 (Edge Delivery Services)。
- 除了上述元件之外，表單區塊還支援所有有效的 HTML5 輸入類型和文字區域作為元件。
- 需要上方未列出的元件嗎？請從您的官方地址傳送電子郵件至 aem-forms-ea@adobe.com 以提出請求。
簡單易用的表單編輯器
以核心元件為基礎的自適應表單編輯器類似於您已用於建立 AEM Sites 頁面的編輯器。以下是您獲得的內容：
-
熟悉的 UI 元素和設定：設定表單元件的屬性時，您會看到屬性對話框，外觀和您在 WCM 核心元件上所使用的對話框非常相似。這可讓您更快找到所需的選項。如同 WCM 核心元件，表單元件的屬性對話框會顯示在編輯器的中央，以清楚的索引標籤分隔基本和進階選項、說明文字及協助工具資訊，所有內容都以索引標籤格式顯示，以方便瀏覽。
-
規則編輯器：您可以新增邏輯和動態功能至表單，而不需要撰寫程式碼。您可以使用內建規則編輯器進行下列：
- 根據使用者選擇以顯示或隱藏欄位
- 啟用或停用物件
- 設定物件的值
- 執行計算
- 設定物件的屬性
- 驗證資料輸入
- 叫用服務 (呼叫外部功能)
- 使用內建函數 (常見任務的預先定義函數)
- 使用自訂函數 (自己為特定需求撰寫的程式碼)
- 驗證欄位和面板 (確保資料符合要求)
- 驗證物件的值
- 執行函數以運算物件的值
- 叫用表單資料模型 (FDM) 服務並執行作業
- 動態新增樣式 (根據條件變更外觀)
- 建立其他規則 (串接動作和邏輯)
- 及更多內容！
規則編輯器沒有程式碼編輯器。您可以使用自訂函數，將自己為特定需求撰寫的程式碼新增至規則編輯器。
-
預填表單：當使用者開啟表單時，會自動將現有資料填入表單中的特定欄位。如此一來，使用者就無需手動輸入可能已存在的資訊，進而節省時間與精力。核心元件編輯器提供 OOTB 預填服務，可在表單資料模型的協助下填入表單欄位。您也可以為更複雜的情境建立自訂預填服務。
-
記錄文件 (DoR)：記錄文件 (DoR) 是指透過表單提交的資料的正式、可列印版本。它用作使用者輸入資訊的永久記錄，以方便使用的格式 (通常是 PDF 文件) 提供提交資料的快照。您可以使用編輯器輕鬆設定自訂範本，或使用 OOTB 範本產生 DoR。
-
表單資料模型：自適應表單資料模型 (FDM) 可作為自適應表單和資料來源之間的橋樑。它基本上定義您的表單收集和互動之資料的結構和組織。您可以使用編輯器輕鬆地將表單與表單資料模型 (FDM) 連接。
-
表單提交：表單提交是指使用者填寫並傳送已填妥的表單的過程。這會觸發在表單設定中定義的一系列動作，最終將提交的資料進行儲存或處理。自適應表單編輯器提供多種設定表單提交的選項。常見的提交動作包括：
-
Sites 頁面編輯器中的自適應表單核心元件：您可以在 AEM 頁面編輯器和 AEM 體驗片段中啟用並使用自適應表單核心元件，以便在建置 Sites 頁面的同時直接建立資料擷取體驗。
embed https://video.tv.adobe.com/v/3419284?quality=12&learn=on
啟用自適應表單核心元件
在 AEM Forms as a Cloud Service 上啟用自適應表單核心元件，可讓您使用 AEM Forms as a Cloud Service 執行個體開始建立、發佈和傳遞以核心元件為主的自適應表單和無周邊表單至多個管道。如需啟用自適應表單核心元件的詳細指示，請參閱在 AEM Forms as a Cloud Service 和本機開發環境中啟用自適應表單核心元件。
自適應表單核心元件有下列要求。
如果您的 AEM Cloud Service SDK 版本比 2023.02.0 更舊，請確定已prerelease在您的環境中啟用標幟，因為自適應表單核心元件是 2023.02.0 版本之前搶鮮版的一部分。
建立以核心元件為主的自適應表單
您可以在 AEM Forms as a Cloud Service 或 AEM 6.5 Forms 環境中執行下列動作：