How can we prevent the 'Preview Before Submit' widget from showing some fields?

  • EMFL
    Asked on June 5, 2017 at 11:52 AM

    How can we prevent the 'Preview Before Submit' from showing some the Text boxes and other parts of the original form?

  • David JotForm Support Manager
    Replied on June 5, 2017 at 11:56 AM

    Simply type the exact labels of the fields you do not want to appear in the preview area, and separate each field to a new line:

    How can we prevent the Preview Before Submit widget from showing some fields? Image 1 Screenshot 20

    Open a new thread if you need anything else, we will be glad to assist you.

  • EMFL
    Replied on June 5, 2017 at 12:16 PM

    Thanks for this, but how do we remove the 'text' boxes that have no label, and the some of the Headers in the collapse sections like 'Spacer 1' and the 'Total Amount Due for Workshops & Activity Tickets' in the payment section?

  • David JotForm Support Manager
    Replied on June 5, 2017 at 1:53 PM

    I am looking for a solution. I will get back to you as soon as I figure it out.

  • EMFL
    Replied on June 5, 2017 at 1:59 PM

    Thank you very much.

  • David JotForm Support Manager
    Replied on June 5, 2017 at 2:02 PM

    I have found a way to do it through CSS injection, try the injecting following code to hide the collapse fields(spacers), and the payment field from the preview: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

    #previewContainer li:nth-of-type(4){

        display: none !important;

    }

    #previewContainer li:nth-of-type(6){

        display: none !important;

    }

    #previewContainer li:nth-of-type(10){

        display: none !important;

    }

    And, please specified which other fields (unlabeled) you want to hide. You can load the link of this thread in your browser: https://www.jotform.com/answers/1163603/?, and then upload the screenshot to illustrate which fields you want to hide from the preview:

    How can we prevent the Preview Before Submit widget from showing some fields? Image 1 Screenshot 20

    We will be glad to assist you.

  • David JotForm Support Manager
    Replied on June 5, 2017 at 2:03 PM

    Also, I forgot to confirm if you are referring to this form: http://www.jotformpro.com/form/71525471312954, if yes, then try injecting the code I have provided.

  • EMFL
    Replied on June 5, 2017 at 2:26 PM

    Thanks. I injected the code and it removed the spacers.

    I actually wanted to keep the name, address, email etc.

    Can I also keep the 'Select the Quantity, Date and Time for your session' in the Boating spacer bar?

    I would also like to remove the following text at the top of the form:

    For information about the various Workshops and Activities that you can book for the festival, please click on the boxes below, and select the type, time, day and number of slots that you would like to book.

    Once you have selected one type of workshop, you can either go deirectly to the details and payment pages, or keep selecting other workshop slots by clicking on other workshop boxes.  

    I would like to remove al the text in each of the Spacer boxes. Example below:

    Brass Rubbing Workshop (1 Hour) - 26, 27 or 28 Aug 2017
    Learn about the history of brass rubbing, and information about the various brass replicas, as well as receive tuition to make three rubbings at England's Medieval Festival. The one-hour workshops (start on the hour from 11 am to 4 pm), and will teach the basic brass rubbing techniques, provide a variety of brasses to use, as well as the rubbing paper and coloured wax; and you take away three of your own brass rubbings when you are finished. All tools and materials provided in the cost. **Course fee requires that you have a Weekend or One Day Entry to the Festival, on the day of the course only

     

  • Support_Management Jotform Support
    Replied on June 5, 2017 at 4:11 PM

    Try these CSS Codes to hide the Text Fields:

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

        display: none !important;

    }

    Complete guide: How-to-Inject-Custom-CSS-Codes 

    For the rest of the fields that you want to be displayed, that "has a label", just ensure they are not included on the HIDDEN FIELDS section of the Preview Before Submit Widget.

    How can we prevent the Preview Before Submit widget from showing some fields? Image 1 Screenshot 20