What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.
We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.
Form won't submit (or go to NEXT page)Asked by Laura on March 03, 2014 at 04:36 PM
SOMETIMES my form will not be able to SUMBIT (or go to the NEXT page). SOMETIMES it will. When it can't submit, basically nothing happens when I click the SUBMIT (or NEXT).
If I reload the page, the form will generally work again.
But my form is long and I cannot have users reloading page any time there is an error.
THis error seems to occur about 20-25% of the time. It has occured in differenc browsers Chrome, Firefox, and IE.
I thought perhaps it was a time out error because sometimes when I return to a form, it no longer works. But other times it doesn't work from the getgo.
Form is embedded into my wordpress site. You can view it here: http://piccolinaadventures.com/finalize-your-reservation/
Please help. It is frustrating for users when they're unable to submit their information.
Thank you kindly for your assistance.
With the rapid development of wordpress features, and tons of plugins - this behavior is not expected.
To prevent this from happening, please use our wordpress plugin to add the form to your site and let us know if the problem persists.
Hope this helps.
Thanks for your response.
I installed and ran plugin. (Previously I'd just used embedded code - does it really make a difference?).
But running the form through the plugin did NOT resolve the problem.
After further experimentation, I noticed (both before and after installing plugin) that the problem occurs when I clear the browser cache.
Thanks for your help.
Thank you for the feedback- its very helpful.
I ran some tests (both before and after the plugin installation) and the form worked as expected (the errors you indicated did not show)
Please try accessing your site using a different browser other than the one you use to log in to your Wordpress Admin - same behavior?
Do you have any CDN/Caching plugins installed on your website? I often find that clearing WP cache helps when new features are installed or implemented
Please let us know.
Tried many times. Clearing all browser caches and using different browsers and even different computers. I am not using CDN/caching plugins for wordpress. I tested form on 3 separate machines on 2-3 browsers each (with cleared caches).At first, things worked great. But upon further testing, it hadn't. It's worse. With the WP jotform plugin now the words are also cut off too.Just now (in Chrome) I was able to get through all pages of form (the NEXT button worked) but not the SUBMIT button. Also much of the text is now cut off...as if the jotform form was too big for the wordpress frame.Safari wouldn't allow me to even hit the NEXT button on first page. (needed to reload page to get it to work)Same issue in Firefox.Same issue on mobile.Thanks for your help.
Thank you for the feedback Laura,
Is your form on a wordpress page or a post?
I would reccomend that you would rather embed the form on a page rather than a post.
The reason why I reccomended the plugin is because some plugins on your site admin can cause script conflicts.
I ran some tests, but I'm not seeing the issue from my end.
I would like to narrow-down the cause, please do the following:
1. Log in to your Jotform account using http://jotform.us/login
2. Grab the form's Iframe code and place it on a test page on your site
3. Does it still show the same behavior? Please share the page URL so that we can take a closer look.
Thank you for your patience in resolving this.
Form is on wordpress page, not post.
To recreate error try this: Clear your browser's cache of all forms, etc. Reopen. Load form: http://piccolinaadventures.com/finalize-your-reservation/ Sometimes it loads, sometimes it doesn't.
Problem seems to happen when cache had just been cleared.
I tested iFrame code and Regular Embed Code on separate pages.
Text width doesn't fit page in all cases. But I assume that modifying form width will resolve issue (though, oddly, the issue just appeared after I installed the plugin).
Here are links to test sites and errors found:
IFRAME TEST LINK:
Leaves large white space below form.
Firefox test: Could proceed NEXT from page 1, page 2. Pg 3 could NOT (e-signature didn't load).
Safari test 1: NEXT and SUBMIT worked.
Safari test 2: Could proceed NEXT from page 1, 2, 3. Could not SUBMIT.
Chrome test: NEXT and SUBMIT worked.
Chrome test2: NEXT and SUBMIT worked.
REGULAR EMBED CODE TEST LINK:
Firefox test: Could not proceed NEXT from pg1.
Safari try 1: NEXT and SUBMIT worked.
Safari try 2: Could not proceed NEXT from pg1.
Chrome test 1: NEXT and SUBMIT worked. .
Chrome test2: NEXT and SUBMIT worked.
Safari test: Could not proceed NEXT from pg1
Chrome test: NEXT & SUBMIT worked.
Honestly I think error has to do with the smooth signature or the progress bar. Progress bar will load correctly when I am able to successfully SUBMIT (or press NEXT). When progress bar loads incorrectly (meaning it displays the text, but not the progress made), that is an indication that I will NOT be able to successfully SUBMIT/NEXT.
Found additional Error:
Smooth Signature Error.
If user writes signature, then CLEARS it. Forms still lets them proceed to next page even though Signature is a required item. Form allows user to proceed through all form pages but will NOT allow form submission.
Thank you for taking the time to help us troubleshoot this.
I followed your reproduction steps - and I could see what you mean - sometimes the next and submit buttons do not work when the browser cache is clear.
In some of the browser tests, I noticed a large number of errors - from unloaded CSS files from our CDN to innaccessible scripts that control the behavior of the form.
The Iframe presented the least errors for your page, but still had some script errors - seems your website is highly customized and may have quite a number of plugins that may be running similar scripts.
In any case - there seems to be a sporadic reaction in each browser scenario, and this is attributed to the following:
1. A caching plugin on your WP site like WPCache etc
2. Plugins that run display scripts at the same time as the form
3. Unloaded CSS and JS files from our CDN.
Even as a best guess, only access to your site would allow us a comprehensive troubleshooting - which I see may not be an option.
The Signature field should not allow one to proceed without filling it out - even if they clear it- so the attached validation script is not loaded - or its in conflict with another script that may be running at the time.
I would suggest the following to remove most of the current errors (which have to do with unloaded JS files) - Lets work on a test page first:
1. Download the form's source-code and embed it on a page on your site.
2. Dowload the Script and CSS files as well and store them on your WP-directory in a location of your choosing, then correct the links to the Script files and CSS on the embedded source code.
When you create the test page - let us know and we shall examine it further for possible errors and script conflicts.
I would also suggest that you consider creating a static HTML page template for the form.
We appreciate your patience through this.
Ok, doing it.
First off, I am not aware of any caching plugins used on my site.
However, I have been testing booking engines for the last few months and some in the form of WP plugins. Perhaps they cache without my knowledge and are causing problems. I just deactivated the largest one (Tour CMS) and will now test again.
Here is a list of all plugins I have installed:
Checkfront Online Booking System
CTS InfusionSoft Form Shortcode
Google Analytics Injector
JotForm Embed Forms
Simple Page Ordering
Ultimate Google Analytics
I have created test page with full source code here:http://piccolinaadventures.com/finalize-reservation-test-3-using-full-source-code/ It does not yet link to css/js files. Help needed. ;)
CSS/JS files were uploaded here: http://piccolinaadventures.com/wp-content/testjotformcssfiles/
I am now sure which lines of code to change to redirect CSS/JS files to the uploaded ones. Can you tell me which lines of code I need to change? (copy/paste lines of them here?)
Deactivated both Checkfront Online Booking System and Tour CMS plugins.
Error still persists.
Well, I resolved the problem.
I removed both the Progress Bar and the Smooth Signature widget. Replaced smooth signature with E-Signature.
Form now works perfectly across all browsers.
Errors lay with the progress bar and smooth signature.
Test results as follows:Removed Progress Bar, Substituted Regular E-Sig for Smooth-SigEmbed Code PageFirefox test 1. worked perfectly.Firefox test 2 (Mac). Worked perfectly.Safari test 1. form didn't load. (slow?)Safari test 2. worked perfectly.iFrame Code PageFirefox test 1 . worked perfectly.Firefox test 2. worked perfectly.Safari test 1. worked perfectly.Only problem is huge white space under form!!!!Plugin PageFirefox Mac. Worked Perfectdly.Firefox PC. Worked perfectly.Safari . Worked perfectly.IE. Worked perfectly."Worked perfectly" means NEXT and SUBMIT buttons worked, and that the e-signature (when it was a required item) did not permit user to proceed with a cleared signature pad.
So, simply for your reference if looking to improve the performance of your widgets, the errors that remain are as follows:1. SMOOTH SIGNATURE ERRORIf user writes signature, then CLEARS it. Forms still lets them proceed to next page even though Signature is a required item. Form allows user to proceed through all form pages but will NOT allow form submission.2. IFRAME CODEHuge white space underneath form.
Thanks very much for your efforts to help me troubleshoot this!
I am glad to know that the issue is resolved by removing the "Progress Bar" and the "Smooth Signature" widget. While I was doing some testing, I was not able to replicate the problem and then saw your update that the issue is resolved.
I would suggest you to please test your page where you have embed your form with source code and see if that solves your problem. Here are the steps you should follow to embed your form with iFrame embed code
1. Download your form's source code and add the custom css code.
2. Upload this html file in your own server and grab the html file URL.
3. Paste the following iFrame code in your webpage where you want to display your form:
<iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="XXXXX" frameborder="0" style="width:100%; height:100%; border:none;" scrolling="no"></iframe>
4. Replace the "XXXXX" in the above iFrame code with the html file URL you saved in step number 2 above.
This will ensure that there is no code conflict and at the same time you will retain the custom style as well.
Hope this helps.
Do get back to us if this solves your problem.
I had the same problem described above today.
Next button not operationnal and weird on Firefox, Chrome and Safari.
the last test i did is to replace the embed code with Iframe code.
Seems to work better.
What i've tested is that :
- When i embed code in Html index file on my web site: Errors
- When i launch the form from jotform link it works (i put a link on the form that clients can click).
it seems that if we lanch the form from the jotform site...no problem...from other site...problems..with next button.
We have moved your question to a separate thread and shall be addressed there shortly.