- ncppAsked on March 04, 2014 at 08:59 AM
I created a form http://form.jotform.us/form/40504348788159 and there is an added text area where I have placed in custom HTML. This was to create a scrollable box where we are placing contest rules.
Once I created this and found it to be working as desired, I embedded it on my company's website this past Friday, and it looked great there. Then I came in Monday morning and found that the text in this scrollable box was spilling out of the box onto the rest of the form. I wasn't sure what could have changed, but I looked back in the code and found I needed to add "overflow: scroll" to the style. This fixed the problem.
I save my changes once I make them.
However, I have figured out that any time I open the form back up for editing, this correction is forgotten and it goes back to spilling the text everywhere.
I have tried clearing my browser cache but that doesn't work.
I then cloned the form and started saving changes to that hoping this would make a difference:
It did not. As soon as I open the form again for editing, the custom HTML code inexplicably resets to how it was before. This is incredibly frustrating. Why is it doing that?
- EliezerNAnswered on March 04, 2014 at 10:07 AM
Can you please let us know if you managed to fix the issue? I checked your two forms and the Text shows the scroll bar with no issues:
I also checked the forms in different browsers like Chrome, FireFox, Safari and Opera and it worked fine too.
Let us know if you still need assistance with this inquiry.
- ncppAnswered on March 04, 2014 at 10:11 AM
What I am saying is that if I go back into JotForm to edit the form for any needed changes, THEN it causes the problem where the scroll box stops working. Then I have to go back into the HTML code to re-add the "overflow: scroll" text every time. Every other change seems to be remembered.
So I can temporarily fix the problem, and it will stay fixed unless I have to edit something else. The only way for you to recreate the problem is to log into my JotForm account, find the form, and click the Edit Form button. At that point you would see that the scroll box gets broken.
- pinoytechAnswered on March 04, 2014 at 11:16 AM
Have you tried already clearing your browser cache/cookies and form cache? If not, can you please give a try? After doing that, edit/update your form and re-save it.
Please do update us for any progress.
- ncppAnswered on March 05, 2014 at 11:58 AM
I did not know about the form cache, but I cleared that along with my cookies/browser cache. I edited the form to fix the problems and saved. I previewed the form and it looked good. When I clicked Edit Form again, the old problems were back, so this did not resolve the issue.
- pinoytechAnswered on March 05, 2014 at 12:30 PM
I was able to reproduce the issue that you are referring. To fix this, can you please apply this workaround in your form?
1. In your Text Html field div style, remove height and width. It should be look like this:
<div style="background:#FFFFFF;border:1px solid #ccc;font:10px/20px Georgia, Garamond, Serif;">
<div style="height:120px;width:500px;background:#FFFFFF;border:1px solid #ccc;font:10px/20px Georgia, Garamond, Serif;">
2. Append this custom css into your form to create scrolling.
Here's the guide on how to inject custom css code: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes
You might like to take a look at this clone form: http://www.jotformpro.com/form/40634461393959
If you need further assistance, please let us know.
- ncppAnswered on March 05, 2014 at 12:45 PM
Thank you. That seems to have done the trick!
- pinoytechAnswered on March 05, 2014 at 12:48 PM
Good to hear that. If you need our assistance again, please feel free to contact us at anytime.
Have a nice day!