チェックボックスフィールド
同意事項や複数選択を簡単に収集できます。シンプルな「はい/いいえ」のチェックボックスから、「すべて選択」機能、最小/最大コントロール、スマートなレイアウトを備えた複数選択リストまで、チェックボックスフィールドは強力な検証機能とユーザーフレンドリーなオプションを備え、単一の同意事項や複数選択の質問に対応します。
あらゆるチェックボックスのニーズに応える2つのモード
完璧なもの：
あらゆるユースケースに対応する強力な機能
2つのチェックボックスモード
単一チェックボックスモード:
はい/いいえの質問、同意、オプトインに1つのチェックボックスで対応。利用規約の承諾、ニュースレターの購読、同意フォームなどに最適です。
使用事例：
- 「利用規約に同意します」
- 「ニュースレターを購読する」
- 「はい、最新情報を受け取りたいです」
- 「この情報は正確であることを確認します」
機能と特徴：
- カスタムチェックボックスのラベルテキスト
- デフォルトのチェック/チェックなしの状態
- カスタム送信値 (yes、1、true など)
- 必要な検証オプション
複数チェックボックスモード:
ユーザーが複数の選択肢を選択できる複数オプション。「該当するものをすべて選択」する質問、好みの収集、複数選択のアンケートなどに最適です。
使用事例：
- 「どの機能に興味がありますか？」（複数選択）
- 「ご希望の連絡方法を選択してください」
- 「必要なサービスをすべて選択してください」
- 「どんなトピックに興味がありますか？」（複数選択可）
機能と特徴：
- 無制限のチェックボックスオプション
- 3つのレイアウトスタイル
- 「すべて選択」オプション
- 最小/最大選択制限
- テキスト入力による「その他」
- 「上記以外」の限定オプション
🎨 3つのレイアウト オプション（マルチ モード）
垂直（積み重ね）レイアウト:
チェックボックスは1行に1つずつ縦に並んで表示されます。長いオプションラベルに最適なレイアウトです。
のためのベスト：
- 長いオプションテキスト
- 3〜10のオプション
- モバイルファーストフォーム
- 最大限の読みやすさ
水平（横並び）レイアウト:
チェックボックスは横一列に並んで表示されます。短いラベルのためのコンパクトなレイアウトです。
のためのベスト：
- 2～5個の短いオプション
- コンパクトなフォーム
- デスクトップレイアウト
- スペース効率
グリッド（複数列）レイアウト:
チェックボックスは2列のグリッドに配置されています。読みやすさを維持しながらスペースを節約するバランスの取れたレイアウトです。
のためのベスト：
- 4〜12のオプション
- 中くらいの長さのラベル
- バランスの取れたデザイン
- プロフェッショナルな外観
応答的な行動:
すべてのレイアウトはモバイル画面に自動的に適応し、必要に応じて積み重ねられるため、タッチ操作が容易になります。
✨「すべて選択」オプション
ワンクリック選択:
リストの上部に「すべて選択」チェックボックスを追加します。ユーザーはワンクリックですべてのオプションをオン/オフにできます。
スマートな行動:
- すべての通常オプションを同時にチェックします
- もう一度クリックするとすべてのチェックが解除されます
- オプションの選択が解除されると自動的にチェックが解除されます
- 一部の（すべてではない）オプションが選択されている場合は不確定な状態を表示します
- 「上記以外」をすべて選択から除外する
パーフェクト：
- 長いチェックボックスリスト（5つ以上のオプション）
- ユーザーがすべてを選択することが多いフォーム
- 「該当するものすべてにチェックを入れてください」という質問
- 権限と機能の選択
ユーザー体験：
長いリストで時間を節約できます。ユーザーはすべてを選択し、特定の例外のチェックを外すことができます。
✏️ テキスト入力の「その他」オプション
カスタムレスポンスコレクション:
「その他」チェックボックスを追加し、選択するとテキストフィールドが表示されます。プリセットの選択肢に当てはまらない場合は、ユーザーが独自の回答を指定できます。
使い方：
- リストの下部に「その他」チェックボックスが表示されます
- チェックするとテキスト入力フィールドが表示されます
- ユーザーがカスタムレスポンスを入力する
- チェックボックスの選択とテキストの両方が送信されます
使用事例：
- 「希望する連絡方法：…その他（ご記入ください）」
- 「興味：…その他のトピック」
- 「当社についてどのように知りましたか？」…その他の情報源
- 一致できないリスト
メリット：
予期しない応答をキャプチャし、柔軟性を提供し、「強制適合」の選択を防ぎ、データ品質を向上させます。
❌「上記のいずれでもない」オプション
排他的非選択:
クリックすると他のすべての選択が自動的にチェック解除される「上記のいずれでもない」オプションを追加します。
スマートな独占性:
- 「なし」にチェックを入れると、他のオプションは自動的にチェックが外れます。
- 他のオプションにチェックを入れると、「なし」は自動的にチェックが外れます
- 選択が適用されないことを明確に示す方法を提供します
- 矛盾した選択を防ぐ
使用事例：
- オプションの好みに関する質問
- 「アレルギーをすべて選択してください：…上記のいずれでもない」
- 資格チェッカー
- 興味の選択
含める理由:
フォームの放棄を防ぎ、徹底性を示し、明確な否定オプションを提供し、データの精度を向上させます。
📊 最小/最大選択コントロール
コントロール選択数量:
選択する必要がある/選択できるチェックボックスの最小数と最大数を設定します。
最小選択:
ユーザーに少なくともX個のオプションを選択させる必要があります。要件が満たされるまでフォームは送信されません。
例：
- 「少なくとも2つの興味を選択してください」（最小：2）
- 「少なくとも3つの希望を選択してください」（最小：3）
- 「少なくとも1つのオプションを選択してください」（最小：1）
最大選択数:
ユーザーが選択できるオプションを X 個までに制限します。制限に達するとチェックボックスは無効になります。
例：
- 「上位3つの機能を選択してください」（最大3つ）
- 「最大5つのサービスを選択してください」（最大5つ）
- 「2つ以下のオプションを選択してください」（最大：2）
明確なフィードバック:
ユーザーには、「少なくとも 2 つのオプションを選択してください」や「最大 3 つの選択が可能です」などの検証メッセージが表示されます。
🔧 簡単なオプション管理
選択を完全に制御:
- オプションの追加 – 入力して Enter キーを押すか、「オプションの追加」をクリックします。チェックボックス リストを数秒で作成します。
- 編集オプション – 表示テキスト (ユーザーに表示される内容) と値 (送信される内容) を個別に更新します。
- デフォルトでチェック済み – 各オプションの横にあるボックスをチェックして、特定のチェックボックスを事前に選択します。
- 並べ替えオプション – 上/下矢印を使用してチェックボックスを正しい順序に並べ替えます。
- オプションの削除 – 不要なオプションをワンクリックで削除します。
ディスプレイ vs. バリュー:
- ラベル: ユーザーに表示される内容（例：「メールによる更新」）
- 値: 保存される内容（例: 「email_updates」）
バルクビルディング:
入力して Enter キーを押し、入力して Enter キーを押すことで複数のオプションをすばやく追加し、チェックボックス リストをすばやく作成します。
☑️ シングルチェックボックス機能
カスタマイズオプション：
チェックボックスのラベルテキスト:
チェックボックスの横に表示されるテキスト。明確かつ具体的な内容にしてください（例：「マーケティングメールの受信に同意します」）。
デフォルトのチェック状態:
フォームが読み込まれる際に、チェックボックスを事前にチェックしてください。ユーザーは同意するチェックボックスを意識的にチェックする必要があるため、慎重に使用してください。
カスタム送信値:
チェック時に送信される値を設定します（通常は「yes」、「1」、「true」）。デフォルトは「yes」です。
必要な検証:
チェックボックスを必須にします。ユーザーはフォームを送信する前にチェックボックスにチェックを入れなければなりません。必須の同意事項に最適です。
🔀 条件付きロジック
動的チェックボックスの表示:
他のフォームの値に基づいてチェックボックスフィールドを表示または非表示にします。関連する場合にのみオプションを表示します。
高度なロジックルール:
ANDロジック – すべての条件を満たす必要がある
ORロジック – 任意の条件でアクションをトリガーできます
8 つの演算子 – 等しい、等しくない、より大きい、より小さい、含む、空、など
使用事例：
「配送が必要」にチェックが入っている場合にのみ「配送設定」チェックボックスを表示します
購読チェックボックスがオンになっている場合に「ニュースレタートピック」を表示する
サービスタイプが「プレミアム」の場合、「追加サービス」を表示する
注文合計が 50 ドル未満の場合は「割引オプション」を非表示にする
🎯 ユーザーエクスペリエンスの向上
スマートな機能が内蔵:
- 視覚的なインジケータ – 適切な間隔でチェックボックスをクリアする
- キーボードナビゲーション – オプション間を簡単にタブで移動
- タッチフレンドリー – モバイル用の大きなタップターゲット
- デフォルトの選択 – 特定のオプションを事前にチェックする
- カスタムCSSクラス – チェックボックスグループにスタイルを適用する
- アクセシビリティサポート – ARIAラベル、スクリーンリーダー対応
- モバイル最適化 – タッチ操作に最適なチェックボックスのサイズ
- 明確なラベル – 適切な配置で読みやすいテキスト
- 必須の検証 – エラーメッセージをクリアする
- ヘルプテキスト – 複雑なチェックボックスグループの説明を追加する
3ステップの簡単セットアップ
チェックボックスフィールドを数分で準備
チェックボックスフィールドを追加
チェックボックス フィールドを [基本フィールド] セクションからフォームにドラッグ アンド ドロップします。
モードを選択
はい/いいえの質問の場合は「単一のチェックボックス」を選択し、複数選択オプションの場合は「複数のチェックボックス」を選択します。
オプションの構成
単一のチェックボックスの場合：チェックボックスのラベルと値を設定します。複数のチェックボックスの場合：オプションを追加し、レイアウトを選択し、「すべて選択」または「その他」オプションを必要に応じて有効にし、最小/最大選択数を設定します。
???? これで完了です。チェックボックス フィールドでスマート検証が実行できるようになりました。
実際のアプリケーション
合意と同意
* 利用規約への同意
* プライバシーポリシー同意
* メール同意オプトイン
* ニュースレターの購読
調査とフィードバック
* 「該当するものをすべて選択してください」の質問
* 複数の興味を選択
* 機能設定の収集
* トピックの興味の選択
デジタルコマース
* 製品機能の選択
* サービスアドオン
* 配送オプション
* 通知設定
登録フォーム
* コミュニケーションの設定
* 興味カテゴリー
* 権限設定
* 機能アクセスの選択
用途
* 資格チェッカー
* スキル選択
* 興味のある分野
* 利用可能オプション
設定と環境設定
* アカウント設定
* プライバシーオプション
* 通知の選択肢
* 機能トグル
フィールドオプションを完了する
基本構成
- フィールドラベル – チェックボックスの上に表示される質問またはタイトル
- 説明/ヘルプテキスト – ユーザー向けの追加ガイダンス
- 必須フィールド – チェックボックスを必須にする
- プレースホルダ – チェックボックスには適用されません
チェックボックスモード
モードタイプを選択してください:
- 単一のチェックボックス - はい/いいえの質問、同意、またはオプトイン（1 つのチェックボックス）
- 複数のチェックボックス – 複数選択オプション（複数のチェックボックス）
単一チェックボックスオプション
- チェックボックスの横のテキスト – チェックボックスの横に表示されるラベル（例：「利用規約に同意します」）
- チェック済み開始 – フォームの読み込み時にチェックボックスが事前にチェックされている
- チェック時の値 – チェック時に保存されるデータ値（デフォルト:「はい」）
複数のチェックボックスオプション
レイアウトスタイル:
- 積み重ね（1行に1つ） - 垂直配置
- 横一列に並べる – 水平配置
- グリッド（複数列） - 2列のグリッドレイアウト
チェックボックスのオプション:
選択肢のリストを作成します。
- 表示テキスト – ユーザーに表示される内容（例：「メール」）
- 値 – 送信されたもの（例：「メール」）
- デフォルトでチェック済み – 特定のオプションを事前に選択
- 並べ替え – オプションを上/下に移動します
- 削除 – オプションを削除する
特別なオプション：
- 「すべて選択」オプションを追加 – すべてのオプションを選択/選択解除するチェックボックスを上部に追加します
- テキストボックスに「その他」オプションを追加 - カスタム回答用のテキストフィールドに「その他」オプションを追加します
- 「上記以外」オプションを追加 – 選択すると他のすべてのチェックが外れる排他的なオプションを追加します
選択制限:
- 必要な最小選択数 – 選択する必要があるチェックボックスの最小数（例：2）
- 選択可能な最大数 – 選択可能なチェックボックスの最大数（例：5）
条件付きロジック
- 条件付きロジックを有効にする – 条件に基づいて表示/非表示を切り替える
- ロジックタイプ
- すべての条件を満たす必要があります（AND）
- いずれかの条件を満たすことができる（OR）
- 条件ルール
- 表示/非表示 – 実行するアクション
- フィールド – チェックするフィールド
- 演算子 – 等しい、等しくない、含む、より大きい、より小さい、空、空でない
- 値 – 比較値
- 複数の条件 – 無制限のルールを追加
高度なオプション
- 隠しフィールド – フィールドを非表示にする（チェックボックスには推奨されません）
- カスタムCSSクラス – カスタムスタイルを適用する
- アクセシビリティ属性 – スクリーンリーダー用のARIAラベル
当社のチェックボックスフィールドを選択する理由
✅ 2つのモード – 1つのフィールドタイプに1つのチェックボックスまたは複数のチェックボックス
✅ 柔軟なレイアウト – 縦、横、またはグリッド配置
✅ すべてを選択します。 – 便利なワンクリック選択
✅ その他のオプション – カスタム応答のテキスト入力
✅ なしオプション – 排他的非選択
✅ 最小/最大制限 – 選択量を制御する
✅ 簡単な管理 – オプションの追加、編集、並べ替え、削除が簡単に行えます
✅ 使いやすい – 明確なラベル、適切な間隔、タッチしやすい
✅ プローブとオシロスコープとの統合 – すべてのフォーム機能とシームレスに連携
よくある質問
Q: 単一チェックボックス モードと複数チェックボックス モードの違いは何ですか?
シングルモードでは、はい/いいえの決定のためのチェックボックスが1つ表示されます。マルチモードでは、ユーザーが複数のオプションを選択できるチェックボックスが複数表示されます。
Q: ユーザーは一度にすべてのチェックボックスを選択できますか?
はい。「すべて選択」オプションを有効にすると、チェックボックスが追加され、ワンクリックですべてのオプションをオンまたはオフにすることができます。
Q: 最小/最大選択はどのように機能しますか?
最小値を設定すると、ユーザーは少なくとも一定数のオプションを選択する必要があります。最大値を設定すると、ユーザーが選択できるチェックボックスの数を制限します。
Q: 「その他」オプションは何をするものですか?
「その他」というチェックボックスが追加されます。選択すると、ユーザーがカスタムの回答を入力できるテキストフィールドが表示されます。
Q: 「上記のいずれでもない」はどのように機能しますか?
これは排他的な選択肢として機能します。選択すると、他のすべてのチェックボックスがオフになります。他のオプションにチェックが入っている場合、「なし」の選択肢のチェックは自動的にオフになります。
Q: 特定のチェックボックスを事前に選択できますか?
はい。シングルモードの場合は「チェック済みで開始」をオンにしてください。マルチモードの場合は、デフォルトで選択する各オプションの横にある小さなチェックボックスをオンにしてください。
Q: 同意するボックスを事前にチェックする必要がありますか?
いいえ。ポリシー、利用規約、同意については、ユーザー自身が積極的にチェックボックスをオンにする必要があります。
Q: チェックボックスの順序を変更できますか?
はい。各オプションの横にある上下の矢印を使用して、好きなように並べ替えることができます。
Q: 表示テキストと値の違いは何ですか?
表示テキストはユーザーに表示されるものです。値は、クリーンで一貫性のあるデータとしてデータベースに保存されます。
Q: チェックボックスで条件付きロジックを使用できますか?
はい。「等しい」「空」「空ではない」などの演算子を使用して、選択内容に基づいて他のフィールドをトリガーできます。
Q: 必須チェックボックスを作成するにはどうすればよいですか?
「必須フィールド」を有効にします。シングルモードの場合、チェックボックスをオンにする必要があります。マルチモードの場合、ユーザーは少なくとも1つのオプションを選択するか、最低要件を満たす必要があります。
Q: ユーザーは確認後に選択を変更できますか?
はい。フォームを送信する前に、任意のオプションにチェックを入れたり外したりできます。「すべて選択」もいつでも切り替えられます。
