WPFormsでフィールド値の一致を確認する

ユーザが2つの異なるフィールドに同じ情報を入力したことを確認したいですか？WPFormsにはEメールによる確認機能が組み込まれていますが、この機能を電話番号や住所など、ユーザの入力を確認する必要のある他のフィールドタイプに拡張することができます。

このガイドでは、シンプルなコードスニペットを使ってフィールド比較バリデーションを実装する方法を紹介します。

Eメールによる確認に特にご興味がある場合は、Eメールによる確認ガイドに従って、コードなしでフォームビルダーに直接設定することができます。

フォームの設定

はじめに、新しいフォームを作成するか、既存のフォームを編集します。この例では、フィールド比較バリデーションを実演するために、2つの電話番号フィールドを持つフォームを作成します。最初のフィールドは電話番号を収集し、2番目のフィールドは確認用です。

新しいフォームの作成にヘルプが必要な場合は、最初のフォーム作成に関するガイドをご覧ください。

次に、フィールド比較バリデーションを処理するコードスニペットを追加する必要があります。サイトにカスタムコードを追加する場所がわからない場合は、カスタムコードの追加に関するガイドをご覧ください。

以下のスニペットは、2つのPhone フィールドを比較し、一致しない場合はエラーメッセージを表示します：

コード内の3つの重要な値をカスタマイズする必要がある：

フォームとフィールドのIDを見つけるのにお困りの場合は、フォームとフィールドのIDを見つける方法をご覧ください。

電話フィールドを使用する場合、以下のパターンを調整する必要があります。 21行目 ($pattern = '/^\d{10}$/';)を追加することで、特に国際番号やカスタム形式など、さまざまな電話番号形式に対応できるようになります。現在のパターンでは、正確に10桁を想定しています。

それで終わりです！フィールド比較を使用することで、フォームに入力されたデータを確実に確認することができます。送信ボタンを条件付きで表示したいですか?条件付きで送信ボタンを表示する方法についてのチュートリアルをご覧ください。