Skip to main content
Selectコンポーネントを使用すると、ユーザーは限られた関連選択肢の中から1つを選べます。性別や活動タイプの選択などに利用します。
Selectコンポーネントの選択肢の値は、最大255文字までです。

レイアウト

選択肢は横並びまたは縦並びで配置できます。

カスタム選択肢

表示値と選択肢の値は、それぞれ独立してカスタマイズできます。
  • 表示値:フォームページ上でユーザーに表示されるテキストです。
  • 選択肢の値:データ連動のフィルター検索で照合に使用される値です。デフォルトでは表示値と一致しますが、独立して設定することもできます。

関連選択肢の設定 - フィールドの表示制御

選択された選択肢に応じてコンテンツを表示したい場合は、関連選択肢を使用します。契約管理、物品請求、調達などのシナリオで有効です。

選択解除のサポート

選択解除機能を有効にすると、ユーザーは選択済みの選択肢を再度クリックして選択を解除できます。 以下の動画は、オンとオフの状態の違いを示しています。

選択肢タイプ

Selectコンポーネントは、4種類の選択肢タイプに対応しています。
  • カスタム:ご自身の要件に合わせて選択肢の内容を定義します。
  • 他のフォームデータを関連付ける:関連の設定を使用し、リンクされたフォームからデータを取得して現在のフォームのデータとして使用します。
  • データ連動:フォーム内のあるフィールドのデータが変更されると、別のフィールドのデータもそれに応じて変更されます。通常、コンポーネントのデフォルト値を設定するために使用します。
  • ゲートウェイデータ:APIエンドポイントは公開アクセス可能である必要があり、レスポンス形式は [{"text":"111","value":"111"}] である必要があります。

Select、複数選択、ドロップダウン単一選択、ドロップダウン複数選択の各コンポーネントは、いずれもカラーボタンに対応しています。有効にすると各選択肢が異なる色で表示され、色はカスタマイズできます。

「その他」を追加

選択肢が確定していない場合は、「その他を追加」機能を有効にしてください。これにより、リストに該当する選択肢がない場合でも、ユーザーは「その他」を選択して独自の内容を入力できます。

一括編集

Select、複数選択、ドロップダウン単一選択、ドロップダウン複数選択の各コンポーネントでカスタム選択肢を管理する際は、一括編集機能で変更できます。
  • 表示値のみを編集:YiDAの選択肢はカスタム選択肢の値と表示値を別々に設定できるため、一括編集はさまざまなニーズに合わせて複数のフォーマットに対応しています。用途に応じて適切なフォーマットを選択してください。
  • 表示値と選択肢の値を同時に編集:各選択肢の表示値と選択肢の値が同一になります。
  • 国際化ラベル:この場合、A、B、Cが各選択肢の値になります。
国際化ラベルは一元管理が必要であり、編集フォーマットが過度に複雑化することを避けるため、この表示値タイプでは一括編集に対応していません。
区切り文字は、半角英数入力モードで入力するパイプ文字 | です。

FAQ

Q:複数の選択肢を持つSelectコンポーネントで、ユーザーが「その他」を選択したときに内容を入力できるようにしたいのですが、関連選択肢を使用せず(追加のコンポーネント設定が必要になるため)、単一のコンポーネント内で完結させたい場合、コードで実現できますか。または、他のコンポーネントでこのシナリオに対応できますか。 A:はい、コードで実現可能です。onChangeイベントをバインドし、テキスト入力コンポーネントのコンポーネント状態を動的に制御してください。