How to test a form before publishing to a live domain?

May be a question with a simple answer, but I can’t see it at the moment… I’m creating a site with a form and before it goes live on the custom domain I’d like to test it to make sure all fields are being captured (ie on the sitename.webflow.io domain). The correct email address has been entered into the site settings but the form data isn’t being sent. Is there any way to do this?

Thanks in advance

Hi, try going to Settings > Forms and scroll to the bottom of the page to see “Form Submission Data”. If you see your test submission here, it’s being captured and there may be an issue on the email receiving end and sending to spam folder or blocked.

Thanks for replying. No, no form data there. I think the form must have an error then. I presume if it’s working correctly I would see an entry here and/or receive an email to the relevant address?

Yeah you would have seen the generic success message " Thank you! Your submission has been received!"

Can you post your share link?

Thank you - the form I’m trying to fix is ‘Purchase a New Property’ page in Quote folder

https://preview.webflow.com/preview/macrae-kaur-a409fe-6c1745635f3d9088f109?utm_medium=preview_link&utm_source=designer&utm_content=macrae-kaur-a409fe-6c1745635f3d9088f109&preview=332fe67183c18ad1f104a784de645152&pageId=6240dcc2ad2c7a73115b68ae&workflow=preview

It was set up by someone else last year and I’m picking it up now to get the site live

I see this form has a few groups set to “hidden” and then reveal as steps are taken. Is it possible that some of these hidden fields are “required” but a user might not be able to see them to enter data? Specifically, there’s one called “Lease Hold” that has a required selection but I can’t figure out how a user will see it to enter data.

I can’t seem to get the customized radio buttons to work in Preview mode to fully either so not sure if I’ve selected it or not.

Ah ok - thanks I’ll investigate…

I think this is the staged form link here;
https://macrae-kaur-a409fe-6c1745635f3d9088f109.webflow.io/quote/purchasing-a-new-property#Topo

Seems to function fine for me, and only 4 required fields which are all on page 2. I haven’t tried submitting any test entries ( @Lee_Vickers is that OK to do? ), so I don’t know if there are errors or script-based validation.

My guess would have been an email issue, spam, etc, however if you’re not seeing captured form data, that’s suspicious.

Yes you can try a submission if you like. Just looking at the form and all the radio buttons are set to ‘required’ - which I don’t think is logical if it’s a choice!

I’m unable to see how div “Lease Hold" is made visible to the viewer. This select field was previously set to “required”. I believe Lee_Vickers had changed it to not be required.

It’s a weird syntax, but that’s normal, it just means that one of the radio buttons in that group must be selected. And as Port of Folio guessed, that’s at the center of your problem.

Basically Webflow is trying to validate the form when you click submit, but several of the required fields are on page one of the form, and are hidden.

When I click submit on page 2 I get these errors;

image

Which are all of those Page 1 required fields.

Some options;

  • You could do a pre-check on page 1, with script, so that the user cannot click Next without completing the required fields. You may
  • You could change how the paging works, so that instead of hiding page 1, it reduces it to 0px wide. Still visible, just not visible. ( That would still have issues I suspect in that the error probably displays next to the field, which is out-of-view. )
  • You could use a 3rd party forms solution, but you’d lose Webflow styling.
  • You can probably find some Webflow-integrated solutions for multi-step forms. Flowbase appears to have one - 🟣 Premium - Multi Step Forms - Webflow

Thank you so much guys, that looks like the cause of it. I’ll try and resolve the required fields and republish - probably tomorrow now.

Follow-up: Thanks for looking into this for me @Port_of_Folio and @memetican , it appeared to be a combination of ‘required’ fields, hidden divs, and fields with incorrect entry type (alphanumeric data was set to ‘number’ and therefore not validated). All sorted now and forms working - thanks again!

1 Like