Hide Certain Sections/Lables on the Preview Before Submit Page

With the "Preview Before Submit" Widget is there a way for it to only show the Questions with their Answers and hide all images/videos and all other text text from the form?

Thanks.

There is actually an option for that in the Preview Before Submit Widget. 

By using Collapse field (form Survey Tools), you can excluded sections on the form in the Preview page.

You can test this form http://www.jotformpro.com/form/52312047873958 and see how it works.

I see in your form https://www.jotform.com/51318929783871 that you were using Page Break fields instead... perhaps if you can re-design the form and use instead Collapse fields, then the option to exclude fields under the collapse will work.

I will also do further test using a clone of your form and check how it will work.

Hope this help. Let us know if you need further assistance.

Hi, I appreciate your suggestion but I don't know if it will allow me to achieve what I'm after.

I want my form to hide all the images and extra text areas when your in "preview before submit."

So that it simply only shows the actual questions with their answer.

Making it nice and easy for someone to review without having to scroll through the whole form.

Thankyou!

Hi,

I think we can achieve this by injecting a custom CSS code in your form that will hide the fields that you do not need to show on the Preview of the Form. I am currently checking the form to get the CSS needed. Please give me more time to further check this. I will get back to you as soon as I get the final CSS code for your form.

Regards.

Hi,

Can you try to inject this custom CSS code in your form?

#previewContainer li:nth-child(1), #previewContainer li:nth-child(2),

#previewContainer li:nth-child(3), #previewContainer li:nth-child(4){

display:none;

}

#previewContainer li:nth-last-child(2),#previewContainer li:nth-last-child(3){

display:none;

}

#previewContainer .control_image {

display:none;

}

To inject custom CSS code in your form, just follow the instructions provided in this article: How-to-Inject-Custom-CSS-Codes.

After injecting the custom CSS code above, your form Preview would look like the screenshot below.

Do let us know if you need further assistance.

Regards.

Fantastic!!!

Are you able to cut out the other text fields that explain the questions as well???

eg. "1. Select what shape you would like to have your mock-up designed on"

Hi,

Can you please try to inject the ff. CSS to see if this achieves what you are after?

#previewContainer li > div.value.no-label {

    display: none !important;

}

Let us know if you need further assistance.

Yes! Thank you so much! Exactly what I was after!

In the "preview before submit" can I increase the distance between the questions and answers so that they aren't so close together.

Here is an screenshot of how mine looks.

It can be achieved by adding the following CSS:

#previewContainer li > .value {
    padding-left: 70px;
}

It will make the Preview appear like this:

You can adjust the value from 70 pixels to any other spacing you wish to give to provided answers on the Preview page.

Please let us know if you need further assistance.