- FineLinesFurnishingsAsked on September 25, 2017 at 04:19 PM
Trying to have the payment amount box have a $ sign in front of the number. Currently only has the USD next to it.
- JotForm SupportaubreybourkeAnswered on September 25, 2017 at 07:13 PM
You can try using the "Masked Input Widget". Just search for it on the widgets tab and drag it onto your form.
You can configure it by clicking on the magic wand.
- FineLinesFurnishingsAnswered on September 26, 2017 at 12:20 PM
This doesn't answer how to use the widget. I put in place but need the actual field to have a $ sign in it.
This is a prepopulated field that I need to have formatted.
- JotForm SupportaubreybourkeAnswered on September 26, 2017 at 01:05 PM
If you click on the wizard (magic wand icon) You will see it automatically adds a $ sign.
Just for example I have named it "Total Order Amount". So there are now two fields called "Total Order Amount".
To have the masked input widget display the Total order amount, you will need to setup a condition to copy the value of the Total Order Amount (form calculation widget) to the Total Order Amount (masked input widget)
I also used the following CSS code to hide the amount field in the payment integration:
display: none !important;
display: none !important;
Only problem is that it says USD. Its not possible to remove this label via CSS or any way other than using editing the full source code and deleting it manually:
- FineLinesFurnishingsAnswered on September 26, 2017 at 01:08 PM
Is this the only way to add a $ sign in front of my amount? Seems awfully complicated than just adding it as a format???
- JotForm SupportWelvinAnswered on September 26, 2017 at 02:13 PM
I'm looking at this now. You have the payment integration in the form (http://www.jotform.us/form/72614330650145), there is currently no way you can add the currency sign in it. You can do it with CSS instead. I'm on it. I'll let you know.
- JotForm SupportWelvinAnswered on September 26, 2017 at 02:31 PM
Inject the following custom CSS codes to your form:
The result will be like this:
- FineLinesFurnishingsAnswered on September 26, 2017 at 02:37 PM
Where would this CSS code go? At the bottom of the current code that's there?
- JotForm SupportWelvinAnswered on September 26, 2017 at 02:44 PM
Yes, at the bottom. But you can also place it at the top.
- FineLinesFurnishingsAnswered on September 26, 2017 at 02:51 PM
I just copied and pasted this information into the Custom CSS area and it didn't change anything. It put it on multiple lines, how should the final look be formatted for CSS?
I don't know how to program in CSS..
- JotForm SupportWelvinAnswered on September 26, 2017 at 03:08 PM
I wonder if you are working on a different form. You do not have an existing CSS in the form yet you've mentioned there was. Did you remove them already?
I am on this form on your account https://www.jotform.com/72614330650145. I've added the CSS. I can see it's not visible in the form builder but works in the preview.
- FineLinesFurnishingsAnswered on September 26, 2017 at 05:26 PM
Thanks, I appreciate your help!