One Time Passwords with Formidable Forms

Problem

This questions was asked in the Formidable Community Forum:

Hi everyone,
I'm looking for a way to add an email OTP (One-Time Password) verification step to my forms.
The desired workflow is:

1. User enters their email address.
2. User clicks a button to "Send Verification Code".
3. A numeric code is sent to the user's email.
4. User must enter that code into a field on the form.
5. Only after the code is correctly entered, the user can submit the entire form.

I am using Formidable Forms. Could you please guide me on how to set this up? Are there specific add-ons or settings for this?
Thanks in advance for your help!

Yang Ming, Formidable Community Forum

Short Answer

Formidable Forms doesn’t ship a built-in “email OTP before submit” feature, and none of the official add-ons (including User Registration) provide a pre-submit one-time code flow. The good news is you can implement it cleanly with a small helper and two Formidable hooks.

Below is a production-ready pattern you can drop into your theme’s functions.php (or a small plugin). It adds a “Send Code” button that emails a 6-digit OTP, stores it server-side for 10 minutes, and blocks submission unless the entered code matches.

Solution

What you’ll build

1. An Email field
2. A 6-digit “Verification Code” field
3. A “Send Verification Code” button (HTML field) that triggers AJAX to email the code
4. Server-side validation that rejects the form if the code is missing/invalid/expired

Field setup (in your Formidable form)

• Email field → note its Field ID (e.g., 25)
• Verification Code field (Short Text, numbers only, 6 chars) → note its Field ID (e.g., 26)
• HTML field (under Advanced Fields) containing a button:

<button type="button" id="ff-send-otp" class="button">Send Verification Code</button>
<div id="ff-otp-status" aria-live="polite"></div>

• Optional: set an input mask/maxlength of 6 on the code field.

You’ll also need your Form ID (e.g., 11). Replace the IDs in the code below.

Add this PHP (functions.php or a small site plugin)

Add this JavaScript (enqueue once on pages with the form)

If you don’t have a central JS file, you can put this in an HTML field below the button, wrapped in <script> tags. Otherwise, enqueue it properly.

Notes, options, and hardening

• Deliverability: for best results, route wp_mail() through a proper SMTP/transactional service (Post SMTP + SendGrid/Mailgun/SES).
• UX: add an input mask/maxlength=6 on the code field; display a subtle “Code expires in 10 minutes.” helper text.
• Security: this stores the OTP keyed to the email hash in a transient. You can key by both email and IP if you like (just be mindful of shared networks).
• Rate limiting: the example enforces 60s between resends; tune as needed and consider attempt caps.
• Multi-form support: if you need this across multiple forms, convert the constants to arrays keyed by form ID, or store the “which fields are email/code” mapping in form options.
• Edge cases: if the user changes the email after requesting a code, validation will fail (as intended). In that case, re-request a code.
• “Can I do this with only built-in actions?” Not pre-submit. Formidable’s email actions fire after a successful submission. OTP must be sent before and validated during submit, so the small helper above is the appropriate approach.