条件付きロジックでフォームフィールドを表示または非表示にする

最終更新日:

条件付きロジックを使用すると、訪問者が別のフィールドにどう回答したかに基づいて、フォームフィールドを表示または非表示にできます。このガイドでは、条件の設定方法、各フィールドタイプでサポートされる演算子、訪問者がフォームを送信したときに非表示フィールドがどう扱われるかを説明します。

条件付きロジックは、Jetpackのすべてのフォームで利用できます。

条件付きロジックの機能

条件付きロジック(条件付きフィールドまたは表示・非表示ルールとも呼ばれます)を使うと、あるフィールドへの回答に応じて、フォーム上に別のフィールドを表示するかどうかを決められます。たとえば、写真撮影の予約フォームでは、撮影の種類として「ウェディング」を選択した場合にのみ、結婚式の日付を尋ねることができます。

各ルールは、そのルールが制御するフィールドに設定します。

  • 「このフィールドを表示」に設定したフィールドは、条件を満たすまで非表示になります。
  • 「このフィールドを非表示」に設定したフィールドは、条件を満たすまで表示されます。
  • 条件のないフィールドは常に表示されます。

訪問者が回答を変更すると、フィールドはすぐに表示または非表示になります。ページは再読み込みされません。

フィールドに条件付きロジックを追加する

別のフィールドへの回答に基づいてフィールドを表示または非表示にするには、次の手順を行います。

  1. フォームを含む投稿または固定ページを開くか、Jetpack → フォーム。
  2. 表示または非表示にするフィールドを選択します。
  3. ブロックツールバーの条件付きロジックを追加アイコン(目の形)をクリックします。また、ブロック設定のサイドバーで条件付きロジックパネルを開き、条件を追加をクリックします。
  4. 「アクション」で、このフィールドを表示またはこのフィールドを非表示を選択します。
  5. 「条件」で、いずれかの場合少なくとも1つの条件が真のときに実行するか、すべての場合すべての条件が真のときにのみ実行するかを選択します。
  6. 確認するフィールド、演算子、および値を選択します。ドロップダウン、単一選択、複数選択、評価フィールドでは、値を入力する代わりに、そのフィールドの選択肢から選びます。
  7. 別の条件を追加するには、条件を追加をクリックし、手順6を繰り返します。
  8. 完了をクリックします。
  9. 保存または公開をクリックして変更を保存します。

「完了」をクリックすると、「条件付きロジック」パネルにルールが平易な言葉で表示されます。たとえば、「次のいずれかが真の場合、このフィールドを表示:撮影の種類は『ウェディング』です」と表示されます。ルールを変更するには、条件を編集をクリックします。

条件付きロジックで使用できるフィールド

画像選択フィールドとカスタムHTMLフィールドを除き、すべてのフォームフィールドが条件付きロジックをサポートしています。サポートされているフィールドは、それ自体の条件によって表示または非表示にでき、他のフィールドの条件でその回答を確認できます。フィールドが自分自身の回答を確認することはできません。

条件で確認する各フィールドには、一意の名前/IDが必要です。2つのフィールドが同じ名前/IDを共有している場合、条件ダイアログでは使用できないフィールドとして表示されます。一意にするをクリックするか、フィールドのブロック設定にある高度な設定 → 名前/IDで各フィールドに固有の名前/IDを付けます。

各フィールドタイプで使用できる演算子

選択できる演算子は、確認するフィールドのタイプによって異なります。

  • テキスト入力、名前、メール、ウェブサイト、電話番号、複数行テキスト:一致する、一致しない、含む、含まない、空である、空でない。
  • ドロップダウンと単一選択(ラジオ):一致する、一致しない、空である、空でない。
  • 複数選択(チェックボックス):含む、含まない、空である、空でない。
  • 数値入力とスライダー:等しい、等しくない、より大きい、より小さい、以上、以下、空である、空でない。
  • 評価:等しい、等しくない、より大きい、より小さい、以上、以下、空である、空でない。値の一覧は1からフィールドの最大評価値までです。
  • 日付選択と時刻入力:一致する、一致しない、より前、より後。
  • チェックボックスと利用規約への同意:チェックされている、チェックされていない。
  • 非表示フィールド:一致する、一致しない、含む。
  • ファイルアップロード:空である、空でない。

非表示フィールドがフォーム送信に与える影響

訪問者がフォームを送信すると、Jetpackはサーバー上ですべての条件を再度確認します。その時点で非表示になっているフィールドは、訪問者に尋ねなかったものとして扱われます。

  • 検証されないため、必須の非表示フィールドが送信を妨げることはありません。
  • その回答は保存されません。回答内のJetpack → フォーム → 回答、通知メールや連携サービスに送信されるデータには表示されません。
  • 他のフィールドの条件では空として扱われます。訪問者がフィールドに入力した後、そのフィールドを非表示にする回答に変更した場合、その非表示フィールドを確認する条件では未回答として扱われます。

マルチステップフォームの条件分岐

マルチステップフォームのどのステップにあるフィールドでも、条件で確認できます。次のフィールド一覧では、ステップごとにフィールドがまとめられています。同じステップまたは前のステップにあるフィールドを確認してください。後のステップにあるフィールドを確認する条件は、訪問者がまだそのフィールドに回答していないため、空の値と比較されます。

条件が適用されない場合

  • 条件で確認しているフィールドを削除すると、その条件は無視されます。フィールドに設定されたすべての条件が無視されると、そのフィールドは常に表示されます。条件ダイアログには「参照先のフィールドは存在しません」と表示されるため、別のフィールドを選択するか、条件を削除できます。