Uncolapsing instead of redirecting to 'thank you' page

  • geo89
    Asked on June 19, 2015 at 11:07 AM

    When clicking submit, I would like to uncolapse a section of my form (displaying quiz results) instead of redirecting to "thank you" page while also being able to send the results via email.

    This is because it is easier to display personalized results with conditions while the form is still active. Otherwise I have to setup a different 'thank you' page for every possible combination which is really difficult due to the large amount of possible answers.

  • Boris
    Replied on June 19, 2015 at 12:43 PM

    I'm afraid that the behavior of the Submit button is not changeable - Submit button submits your form. The Notification Email are sent only after the form has been submitted, so if you displayed the results right on the form, your users could close the browser without submitting their response to you.

    If you would like to mention / list the answers that your user has provided in the form, and have them appear on your thank you page, you can add them by customizing the message of your thank you page.

    Uncolapsing instead of redirecting to thank you page Image 1 Screenshot 40

    Uncolapsing instead of redirecting to thank you page Image 2 Screenshot 51

    Uncolapsing instead of redirecting to thank you page Image 3 Screenshot 62

    If this is not what you are looking for, please let us know a little more about how you would want to personalize the answer/results page, so that we may be able to offer another solution that may be better suited for your request.

    Thank you.

  • geo89
    Replied on June 20, 2015 at 6:21 AM

    Thanks for your answer, I think I found a solution.

    I will make the submit button open the thank you page in a new tab by putting target = "_blank" inside the < form >

    in the source code.

    Then I will need to make the submit button also trigger the next button's actions.

    Any idea on how I can do the former?

  • Elton Support Team Lead
    Replied on June 20, 2015 at 1:03 PM

    @geo89

    Yes that's possible using your form source code. https://www.jotform.com/help/104-How-to-get-the-Full-Source-Code-of-your-Form. Then apply custom function that will be triggered whenever the submit button is clicked. It requires Javascript knowledge though. However, if you want to proceed on this route, here's an example that is very similar to your requirement.

    https://shots.jotform.com/elton//sample_modal_thankyou_page/modal_thank_you_page.html

    On this example, the default thank you page is loaded in a frame container, allowing you to add custom events on submit button without reloading the page or redirection. Inspect the page source on that page, you'll see the following codes. 

    Uncolapsing instead of redirecting to thank you page Image 1 Screenshot 20

    And then use the following script to call custom whenever the form is submitted.

    <script type="text/javascript">

    (function(){

    $$('form')[0].onsubmit = function() {

    //Your script here

    }

    })

    </script>

     

    Hope this helps. Thanks!

  • Elton Support Team Lead
    Replied on June 20, 2015 at 1:07 PM

    Sorry, I replaced the first code with the following image because the target tag is stripped off here on forum due to some code restrictions. 

    Uncolapsing instead of redirecting to thank you page Image 1 Screenshot 20

  • geo89
    Replied on June 20, 2015 at 1:54 PM

    Thanks for the help, I found the solution!

    The following will do the trick:

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

    <script>
    jQuery( document ).ready(function()
        {
        jQuery(".form-submit-button").click(function()
            {
            setTimeout(function()
                {
                    jQuery(".form-pagebreak-next").click();
                    return false;
                }, 500);
            });
        });
    </script>

     

    It imitates the pagebreak next click 0.5 seconds after the submission. This in combination with the target = "_blank" or "thankyou" (with iframe) will work perfectly.

     

    Many thanks!

  • Elton Support Team Lead
    Replied on June 20, 2015 at 2:27 PM

    It's great to know. That's a one fine solution. Thanks for sharing! :)