If you stumble upon a scenario where you needed a visual confirmation of what your users filled out on your form before they submit it, there’s a chance you might have used our Preview Before Submit widget.
But what if you needed something a little simpler, something that shows up right before the SUBMIT button so respondents can see a quick summary of their selections. Or perhaps you just wanted to greet them or create a personalized thank you note showing their name.
Meet the Paragraph element (formerly known as Text) – It’s a nifty powerful tool that allows you to render HTML content and inline CSS. Our guide will be focusing around this form https://www.jotform.com/70421937954967 where a respondent will be sending a simple order. The Paragraph element’s job is to give a quick summary of the respondent’s selections.
The setup is really simple:
1. Add a Paragraph to your form
2. Click the Edit Text pencil icon
3. Position the text cursor to the section where you want the field to populate.
4. Click FORM FIELDS then click the field you wanted to add.
Please note: Both curly braces, “{ }“, must be highlighted to format the field’s text. (e.g. bold, font color, alignment)
Now, in our demo form, the order summary looks like this when the form is filled out:
And here’s how Paragraph element was mapped:
Quick Summary of your Order:
Hey, {name}! You’re about to order a {size} sized {shirtType} with your name printed at the {print}.
Looks good? click SUBMIT so we could process your order!
Easy, right? So, give it a spin and let your creativity do the work on how you would utilize this little trick!
Send Comment:
11 Comments:
I tried this option with the driving distance widget. Bit it only gives the distance information, not he "from" and "to" adresses.
In the confermation email it does it correctly, is this a bug?
How so I send the Paragraph with the submission?
Is there a way to add a NEW form field into a paragraph, like a radio button, or a yes/no, or even a dropdown??
For instance, I explain something to the customer, then I ask them if they want to continue... Yes or No?
Hey,
I can't find the "text" in basic elements. Where I can find it ? Thanks for your help.
What if I want to use the 'text' values from a Single Choice widget, instead of the (hidden) 'number' values?
For example, I have a Single Choice selector (called "Meter Size") with two options (let's call them "A" and "B"), with "Use Calculated Values" turned ON, and those values are set to numbers (let's say "100" and "200") which are not visible on my form.
My Text Box is using the field {MeterSize}, but it results in "100" or "200" being substituted, just as {MeterSize} would do in a Calculation widget. How can I instead pull the "A" and "B" into my text field??
Hi,
We are using jot form for online registration. However we want to all students to spread their tuition out over multiple payments and have that handled automatically without requiring our staff to enter the payments manually. Can you recommend a solution for doing that which would work with jotform? We are currently using PayPal as our payment gateway but would consider other options. We are in Canada.
Thanks,
Richard
We used to deal with Moneris but changed recently as their fees were too high. We have been dealing with Daniel Talafre of CPS ().
They are much more reasonable than Moneris and offer the same services.
Joanne
Hi,
I am setting up a summary text field and I would like to pass just some of the subfields of some of the form fields.
Such as the postal code from the address field. I can see in the "Field Details" in the properties section that the field is {address} and the Field ID is #input_31_postal.
Thanks
Hello!
In relation to this Input passing, I am having trouble passing the values from an Input Table to the text box. I only seem to be able to access one form field {typeA}, and it will only give me one value (there are 8 values i need to describe individually). Do I need to use the #Input_0_0_0 values?
Help!! Thanks!
R
For some reason this works fine for me when I use "Preview Form" or open a form.jotformeu.com/... link, but stops working as soon as I publish it on my website. How can I fix it?
What is this relying on from the client side to work?
I had it working great in my form, then I tried to hack some code to only pull the state from the address field in, and now the values are not populating in the text at all for me, even in the demo form you referenced above.
I tried it both in Chrome and Edge, and it doesn't work in either browser.