review before submitting the form

  • Profile Image
    chavella
    Asked on February 25, 2021 at 08:02 PM

    Hi there, we have a number of order forms already setup, but still testing them before we upgrade to a paid year subscription.

    Just wanted to know after people make their selection, how can they check to see they have ordered the correct items, and add/delete items before they go to enter their payment details.

    Some people may click on the wrong items or the wrong quality. They will not know this until after payment has gone through.

    How can you do this?

  • Profile Image
    Richie_P
    Answered on February 26, 2021 at 03:52 AM

    You may add a review before submit widget in your form for your form respondents to review the data before submitting.

    1614329209_6038b57991c7b_1.png

    Pleas check it out and let us know if this fits your requirements.

  • Profile Image
    chavella
    Answered on February 26, 2021 at 04:43 AM

    Thank you but find it rather difficult to use. We added the widget, which goes at the bottom of the form, but where to from there? We just want to check the order visually, to make sure clients have ordered the correct thing.

    Are there any further explanations of how to do this?

  • Profile Image
    Richie_P
    Answered on February 26, 2021 at 06:08 AM

    Once you add the preview before submit widget, your form respondents would have to fill all the form details first and then they would click review answers.

    1614337481_6038d5c9a4c88_1.png

    Once the review answers is clicked, the field details will show.

    1614337524_6038d5f4016f9_2.png

    If user is satisfied with the data, he may submit the form or go back to the form to redo some of the details.

    You may test it out on my sample form using Square sandbox.

    https://form.jotform.com/210562227409956

    Square test CC number is :4111 1111 1111 1111

    Security code:111

    Exp date: 02/26

    Hope this information helps.

  • Profile Image
    chavella
    Answered on February 26, 2021 at 03:45 PM

    Thank you for this, but is there any way they can review what they selected by seeing the images, not text?

  • Profile Image
    chavella
    Answered on February 26, 2021 at 05:17 PM

    Tested this, looks good but came up with an error, see below.

    1614377491_60397213e296e_Is this error because of Square sample data or a real error.
    The URL form is https://www.jotform.com/build/210456337057858#preview

    Please see sample form with sample data and Square sandbox, before we hit the preview button - https://www.jotform.com/build/210456337057858#preview

    Is it something we are doing wrong

  • Profile Image
    Lorenz_A
    Answered on February 26, 2021 at 10:44 PM

    Hi there,

    Is there any way they can review what they selected by seeing the images, not text?

    Sadly, the widget will only show the summary of data as text. There is no option from the widget to include images.

    To avoid confusion, I have moved your other query to a separate ticket. You may refer to this link https://www.jotform.com/answers/2929887 and we'll be responding to you there very shortly.

    Thank you.



  • Profile Image
    chavella
    Answered on February 27, 2021 at 07:06 AM

    Just another question on the Review Form.

    When review the form in Mobile Phone mode (portrait) the information is not all that mobile friendly. It cuts off the right hand section. You cannot even see submit. see below. How can this be fixed since most people use a mobile in portrait mode not landscape.


    1614427383_603a34f702a18_

  • Profile Image
    Richie_P
    Answered on February 27, 2021 at 09:04 AM

    You may use custom CSS to make the widget mobile responsive.

    You can add this custom CSS in your Form designer.

    @media screen and (max-width: 480px){

    #previewContainer #previewButtons {

       display: block !important;

    }

    }

    Guide:https://www.jotform.com/help/117-how-to-inject-custom-css-codes

    Let us know how it goes.

  • Profile Image
    chavella
    Answered on February 27, 2021 at 05:23 PM

    Thank you, looks good but now we have an issue with the landscape orientation of the form in mobile mode. See below.

    1614464623_603ac66fa8209_

    How do we fix this one?

  • Profile Image
    Kenneth_C
    Answered on February 28, 2021 at 05:08 AM

    Hi there,

    After customizing the form, here is how it looks:

    1614506352_603b697005083_y1.png

    If that is acceptable, kindly insert these codes into your Inject Custom CSS Area: https://www.jotform.com/help/117-how-to-inject-custom-css-codes

    @media screen and (max-width: 580px)and (orientation: landscape){

    li.noprint {

      width: 87% !important;

    }

    button#backToForm {

      min-width: 33% !important;

    }

    button#printForm {

      min-width: 33% !important;

    }

    button#input_2 {

      min-width: 33% !important;

    }

    }

    I hope that helps.
    Best.