Form/Data Verification Before Payment

I was wondering if anyone had solutions they could share for methods to verify form data before allowing the user to enter the payment modal?

We are having problems with users not providing email addresses and addresses for orders. This prevents their order from being properly processed (some orders are for the purchase of a shipping label which requires a full address).

I do not wish to make those fields required - the use case here is a registration form for a product, with optional upsells upon completion of the registration. I don’t want to discourage registration from users who do not wish to provide all of the data, and I also don’t want to lose the revenue opportunity from these users.

Does anyone have any tips or advice to share?

If you are able to clearly define the conditions for field requirements in FMS, I suppose you could run a hook there to validate the state and then enable the buttom after that on the from end.

It does sound like it could be handled on the front end though.

Since you ave full JS, you can create your validation rules in JS and if all is OK, enable a pay button etc too.

Thanks Charles - that was the only idea I really had: to conditionally hide the payment button and show the user a message using JS. Problem is I’m a novice with JS - but I’ll figure it out somehow.

Am I correct in stating there is no way to run a BF action before opening the modal, since that is a special function and not a typical BF button?

Depending on the gateway you are using you can.

Stripe can be programmatically called and there is an example near the bottom of the Stripe examples page. is slightly different. For that you can add a hidden class to the button, this will hide it but the Auth code will still exist. Then you can later change the class and even programmatically ‘click’ it if you want. ( Click with jQuery )

If you rough out what you want to check, I can help you here and get your started on the JS validations.

Then you can later change the class and even programmatically ‘click’ it if you want. ( Click with jQuery )

This is a fascinating idea. Could I do the below:

  • Add a BF button, with an action to run JS to validate the necessary data.
  • Put a hidden Authorize button on the page (visible: false)
  • Use JQuery to click the hidden button programmatically depending on the result of the JS validation.

This would effectively put a button between the user and, without ever forcing them to click twice.

Is my logic sound - or would the visibility prevent jQuery from clicking?

Super close,

Don’t use the visible key as that actually prevents the object from ever being in the DOM. Instead, the hidden class just makes it not shown, and the code is still in the DOM for jQ to trigger.

Excellent info - thank you Charles! I will try this approach and I think it is a great solution to the problem. I also appreciate learning more about how to use jQuery and some more advanced options - I need all the help I can get!