How to detect if form in an iframe is successfully submitted?

  • site_codeorg
    Asked on August 19, 2019 at 9:17 PM

    I'm embedding multiple survey forms, each as an iframe, in our page. How can I detect when a form is successfully submitted? (I want to add a checkbox to the side of each completed form for better user experience.)


    Thanks!

  • Kevin Support Team Lead
    Replied on August 19, 2019 at 9:57 PM

    You may simply fill out the form, if you get the thank you page it means it was successfully submitted, you can also search the submission on your account, this guide will help you doing so: https://www.jotform.com/help/269-How-to-View-Form-Submissions 


  • site_codeorg
    Replied on August 20, 2019 at 1:14 PM

    Sorry for not being clear. I want a page to automatically detect that a survey form in one of its iframes is submitted.


    My page looks like this:

    [ ] Survey Section 1: <iframe to Jotform survey 1>

    [ ] Survey Section 2: <iframe to Jotform survey 2>

    [ ] Survey Section 3: <iframe to Jotform survey 3>

    User will fill out one survey at a time. (For another reason it has to be 3 separate surveys.) I want to detect when a survey is completed (replaced by the Thank you page), then mark a checkbox, do some backend processing and direct user to the next survey section.


    I've looked at the official iframe embedded code (under Publish -> Embed -> iFrame). None of the iFrame messages (scrollIntoView, setHeight etc.) support my scenario.


    What is your advice for this case?


  • Kevin Support Team Lead
    Replied on August 20, 2019 at 2:38 PM

    Unfortunately, that's not possible to implement, I mean, to accomplish the functionality you want as such, it would be required to add some code that it's not supported on our thank you page wizard. 

    If your purpose is to have the users filling different sections of the form without leaving the page, then you may try with a multi-page form, this way they instead of submitting a form, click on a next button and move to the next page where they can fill the fields. Here's a guide with more details about how to create this form: https://www.jotform.com/help/119-How-to-Create-a-Multi-Page-Form-with-JotForm 

    Another option is to edit the thank you page and provide the user with the link to the next form, this guide will help you editing the thank you page: https://www.jotform.com/help/211-Setting-up-the-Thank-You-Page 

    If you would require to have users clicking on a check box and then redirect them to another form, then you will need to somehow develop this thank you page on your end and redirect each form to your thank you page, this guide will help you redirecting users to an external page: https://www.jotform.com/help/38-Redirecting-Users-to-a-Different-Page