選項按鈕元件

最後更新： 2025年6月24日

建立對象：

  • 開發人員
  • 管理員
  • 使用者

最適化表單中的選項按鈕是一種輸入元素，可讓使用者從一組相關選項中選取一個選項。 它由一個小的圓形按鈕表示，該按鈕已填滿或空白，以指示是否選取該選項。 當使用者選取一個選項按鈕時，群組中的其他按鈕會變為取消選取。 當有多個互斥選項且一次只能選取一個選項時，通常會使用選項按鈕。

秘訣
您是否考慮過適用於 AEM 的 Edge Delivery Services？
現有的專案可以繼續使用本文件中所述的方法。然而，針對新專案，Adobe 建議採用 Edge Delivery Services。

範例

範例

屬性對話方塊

範例

在此範例中，Options元素用於將選項按鈕群組在一起。 顯示文字 ​專案是用來提供專案的標籤，而​ 資料值 ​是用來指定提交表單時傳送至伺服器的值。

每個選項按鈕選項都有唯一的「資料」值和「顯示文字」屬性。 如果使用者選取「1-10」，則表單提交時會將對應的資料值傳送到伺服器。 接著，伺服器端指令碼可處理此資料，以判斷使用者選取的選項，且可用於執行各種動作，例如更新表單中的其他欄位，或將表單資料提交至伺服器端指令碼以供進一步處理。

此外，每個選項按鈕都可設定為每個選項提供不同的處理值，並可使用最適化Forms規則編輯器進行設定

使用情況

在表單中使用選項按鈕有幾個理由，包括：

  • 有限選擇：選項按鈕是用來提供預先定義的選項清單，供使用者選擇，一次只能選取一個選項。 當選項的數量有限且互斥時，此選項會很有用。

  • 清除表示方式：選項按鈕清晰易懂，讓使用者可以輕鬆瞭解選取的內容。

  • 一致性：使用選項按鈕可確保向使用者呈現選項時採用一致且標準化的方式，讓他們更容易理解表單並與之互動。

  • 更易於使用：選項按鈕易於使用，尤其是不熟悉技術或行動能力有限的使用者。

版本和相容性

最適化Forms選項按鈕核心元件於2023年2月發行，屬於Cloud Service核心元件2.0.4以及AEM 6.5.16.0 Forms或更新版本的核心元件1.1.12的一部分。 下表顯示所有支援版本、AEM相容性以及對應檔案的連結：

元件版本AEM as a Cloud ServiceAEM 6.5.16.0 Forms或更新版本
v1與
版本2.0.4和更新版本相容		與
版本1.1.12及更新版本相容，但小於2.0.0。

如需核心元件版本和發行版本的詳細資訊，請參閱核心元件版本檔案。

技術細節

在GitHub的技術檔案中取得最適化Forms選項按鈕核心元件的最新資訊。 如需開發核心元件的詳細資訊，請參閱核心元件開發人員檔案。

設定對話方塊

您可以透過「設定」對話方塊輕鬆自訂訪客的單選按鈕體驗。 您也可以輕鬆定義選項按鈕選項，以提供順暢的使用者體驗。

基本索引標籤

基本索引標籤

  • 名稱 — 您可以在表單和規則編輯器中輕鬆識別具有唯一名稱的表單元件，但名稱不得包含空格或特殊字元。

  • 標題 — 您可以使用其Title輕鬆識別表單中的元件，預設情況下，標題會顯示在元件上方。 如果您未新增標題，則會顯示元件的名稱而非標題文字。

  • 允許標題使用RTF格式 — 此功能可讓使用者格式化純文字標題，並整合如粗體、斜體、底線文字、各種字型、字型大小、顏色等功能以及可增強視覺呈現和自訂的其他選項。 它提供更大的彈性和創意控制，讓標題在檔案、網站或應用程式中脫穎而出。
    選取​ 允許標題為RTF格式 ​的核取方塊後，即可看到格式化選項，以設定元件標題的樣式。 若要存取所有可用的格式選項，您可以按一下 全熒幕圖示 標籤。

    RTF支援

  • 隱藏標題 — 選取隱藏元件標題的選項。

  • 選項 — 您可以使用​ 新增 ​按鈕來新增資料值並顯示文字組。
    新增選項後，可以執行下列動作：

    • 資料值 — 此選項可讓您在選取選項時，輸入要送出的內容。
    • 顯示文字 — 此選項可讓您輸入要在最適化表單中顯示的內容。
    • 刪除 — 點選或按一下以刪除選項按鈕的選項。
    • 重新排列 — 點選或按一下並拖曳以重新排列選項。
      您也可以使用​ 允許選項的RTF格式 ​來格式化選項群組選項。

    選項的 RTF支援

    選取​ 允許RTF格式選項 ​的核取方塊後，元件選項的樣式就會顯示出來。 若要存取所有可用的格式選項，您可以按一下Fullscreen 全熒幕圖示 標籤。

    選項的 RTF支援

  • 繫結參考 — 繫結參考是儲存在外部資料來源中並在表單中使用的資料元素的參考。 繫結參考可讓您將資料動態繫結至表單欄位，讓表單可顯示資料來源的最新資料。 例如，繫結參考可用於根據在表單中輸入的客戶ID在表單中顯示客戶名稱和地址。 繫結參考也可用來使用輸入到表單中的資料更新資料來源。 透過這種方式，AEM Forms可讓您建立與外部資料來源互動的表單，提供順暢的使用者體驗來收集和管理資料。

  • 標籤為未繫結的表單元素：選取選項以設定未連結至任何結構描述的表單欄位。 此選項可讓您儲存資料而不更新資料來源。 它也可讓您以自訂方式處理資料，與標準資料庫整合不同。

  • 提交值的資料型別 — 此選項會指定選取任何選項時傳送值的資料型別。 如果提交值​ 的 ​資料型別設定為Number，而您在​ 選項 ​索引標籤​上新增字串資料至​ 資料值 ​，畫面會顯示Value type mismatch錯誤訊息。

  • 預設選項 — 此選項可讓您在表單載入時新增預先選取的預設值。 如果提交值​ 的 ​資料型別設定為Number，而您新增字串資料至​ 預設選項，畫面會顯示Value type mismatch錯誤訊息。

  • 顯示選項 — 此選項是用來設定最適化表單中選項按鈕的視覺對齊方式。 支援的兩個選項為：

    • Horizontal — 選取此選項時，選項按鈕會在最適化表單中由左至右顯示。
    • Vertical — 選取此選項時，選項按鈕會在最適化表單中由上到下顯示。

  • 隱藏元件 — 選取選項，以隱藏表單中的元件。 元件仍可於其他用途存取，例如將其用於規則編輯器中的計算。 當您需要儲存不需要由使用者看到或直接變更的資訊時，這將很有用。

  • 停用元件 — 選取選項以停用元件。 一般使用者無法啟動或編輯已停用的元件。 使用者可以看到欄位的值，但無法修改它。 元件仍可於其他用途存取，例如將其用於規則編輯器中的計算。

  • 唯讀 — 選取選項，讓元件無法編輯。 使用者可以看到欄位的值，但無法修改它。 元件仍可於其他用途存取，例如將其用於規則編輯器中的計算。