Preview Before Submit: Ability to apply CSS styles to the Entries

  • Profile Image
    Marfieldcom
    Asked on June 24, 2015 at 10:57 AM

    I'm thrilled to find Preview Before Submit, but

    1. I can't add it if I already have a Payment widget.

    2. I would like to be able to control the style of entries shown:

    • display:none (especially for the form field labels)

    • backgrounds

    • font-family

    • font-weight

    • font-style

    • font-variant

    • font-size

    • text-align

    • text-color

    • text-decoration

    • text-indent

    • text-transformation

    • line-height

    • letter-spacing

    • word-spacing

    • vertical-align

    • tables

    • border

    • margin

    • padding

    • display

    • position

    • float

    Basically, all CSS properties.

    It doesn't look like I have any control over that in Preview Before Submit.

    I see How to Save Forms to Continue Later but maybe I'm looking for more of a multi-page wizard.

    I also love that we have the option to include/exclude/style fields in the notification/autoresponder emails. I would love to be able to drag form field variables into a box on my existing form and style them.

    Thoughts?

     

     

  • Profile Image
    Jeanette
    Answered on June 24, 2015 at 12:20 PM

    It seems you have several unrelated questions. On regards to the Preview Before submit app, I've opened a ticket with this request.

    On regards to this comment:

    I would love to be able to drag form field variables into a box on my existing form and style them.

    You can certainly style form fields, please check this section :

    http://www.jotform.com/help/300-Form-Designer-Tutorial-Let-s-create-fantastic-forms-

     

  • Profile Image
    Marfieldcom
    Answered on June 24, 2015 at 01:07 PM

    Form Designer is great for the original form, but I was looking for a way to drag the form field variables like I can on the autoresponder/notification emails, and style them inside the form.

    I was able to copy the form field variables from the autoresponder, paste them into Notepad, then paste them into a Text area on my form, then style them with HTML.

    The form instantly shows the values of each entry in the text area.

    http://www.jotform.com//?formID=51684382304960

    It would be nice to have the option to pick the merge fields from the toolbar in either the Preview Before Submit or a new similar widget. I'd call it Preview Pane but I'm not the developer. :-) Cheers!

     

  • Profile Image
    Mike_G
    Answered on June 24, 2015 at 04:00 PM

    You can try this workaround to add styles on the Preview Before Submit Widget by using the HTML Source Editor Available on the Text Area. I assume you only want to have the Text Area to be shown when the form is viewed before submission. 

    To exclude the other text field when you Preview before submission, you can:

    As for the result: 

    I hope this helps. However, if this is not what you really want to happen, kindly give us more details and we will be glad to help you. Thank you. 

  • Profile Image
    swiftonline
    Answered on May 20, 2016 at 07:02 AM

    I'm not sure I understand this - I want to do the exact same thing, ie. have a preview before submit where I can show all the answered fields (will use the hide feature in the widget) and format using the HTML source editor - so do I simply add a text area to my form and that will automatically update with the answers that are shown on the form when the preview button is used??  Not following - sorry!
  • Profile Image
    EltonCris
    Answered on May 20, 2016 at 09:15 AM

    @swiftonline

    We will answer your question on a separate thread here https://www.jotform.com/answers/843403.