How can I hide some of the text fields in the Preview Before Submit widget?

  • Profile Image
    Jerole
    Asked on January 18, 2018 at 01:02 PM

    Hello

    The Preview Widget is currently distorting images and showing text fields I do not want to show.

    Since not all the fields show the field name, in Advanced Properties, I went into the CSS to find some for testing; I added them to the HIDE FIELDS option in the Preview widget.

    Even then, they still showed up.

    All images are squished into 210ish px.

    I'm working in Firefox.  I tried Chrome, same issue.

    Help!

  • Profile Image
    Adrian
    Answered on January 18, 2018 at 02:13 PM

    To fix the images distortion, I have added this Custom CSS to your form:

    #previewContainer li>div img {

      max-width: 100% !important;

      max-height: 100% !important;

    }

    To hide the fields, you need to add the questions label to the widget.

    For example, if you want to hide the email field, you add the email field label which is E-mail.

    1516302780Fullscreen_1_18_18__8_11_PM.pn

    Let us know if you have further questions.

  • Profile Image
    Jerole
    Answered on January 18, 2018 at 03:19 PM

     Adrian, thank you.

     

    How do I hide a field without a label? Many are text only fields I added for instructions.

    The question text (label) shows up as all the HTML.

    I added the HTML for some of the text fields to hide.

    Here is what happens:

    The image fields do not show at all.

    There are text fields on page 4 that do not show even though I did want to see them.

    When you hit SUBMIT, for a moment, the text fields on page four will show, with the selection fields underneath, then it goes to the Thank you page.

     

  • Profile Image
    Welvin
    Answered on January 18, 2018 at 04:00 PM

    You seem to have figured this out already. Let us know if you need further assistance. 

  • Profile Image
    Jerole
    Answered on January 19, 2018 at 11:00 AM

    Welvin,

    Not really working.

    I am working on 2 forms nearly simultaneously.

    The Dinner version is a modified clone of the Brunch version. 

    Brunch: There are images fields that do not show, even though they are not hidden in the Preview widget.

    Dinner: There are text fields I do not want to show, but they show. When you hit SUBMIT, for a brief moment (2 seconds), the text fields on page four will show, with the selection fields underneath, then it goes to the Thank you page. Not long enough to read.

    https://form.jotform.com/Jerole/love-brunch-menu-selections-2018

    https://form.jotform.com/Jerole/love-brunch-menu-selections-2018

    Brunch

    https://form.jotform.com/Jerole/love-brunch-menu-selections-2018

    Dinner

    https://form.jotform.com/80174536684160

    https://form.jotform.com/80174536684160


  • Profile Image
    Welvin
    Answered on January 19, 2018 at 12:34 PM

    Actually, there is no such option to hide headers, texts, and images in the preview. I initially thought you did it by CSS, but I just checked and found nothing in the CSS section. I wonder why it worked with just copying the whole texts into the settings.

    Anyways, as mentioned, the CSS is the workaround to hide the specific text areas or images or headers in the preview. I have your forms, so please let me know which of the texts/headers/images from page 1 or 2 or 3 to hide in the preview. I'll do my best to have you the overall CSS to hide. Again, from both forms. 

  • Profile Image
    Jerole
    Answered on January 19, 2018 at 01:35 PM

    Ok,

    The deadline is looming to the point I may have to scarp this option. Thanks for now.


  • Profile Image
    Adrian
    Answered on January 19, 2018 at 02:09 PM

    Let us know which texts/headers/images you want to hide in the preview and we will be happy to help.