How Can I Implement My Mobile Responsive Form On Wix.com?

Hi,

I wanted to reach to you because I am having trouble properly implementing my mobile responsive form on my Wix.com site. 

I have Pay Pal integrated at the bottom of the form, and every time I select a product, the form returns to the top and freezes.  Is this just a product limitation? 

I made sure that it was activated on the Jot Form settings and also used the source code in order to complete this process.  Let me know if there is anything you can do here.

Bill Sarras

Hi,

Have you tried following this guide on how to add your form in Wix: http://www.jotform.com/help/70-Adding-a-Form-to-Wix-Site?

Please also make sure that you are setting the height value to "px" and not "%". This is because the iFrame embed code needs to have a specific height value in px. 

If you are still having problems regarding the form jumping to the top and freezes.

Try using the iFrame embed code and removing the <script> tag on it. Here's an example:

Before:

<iframe id="JotFormIFrame" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotformpro.com/form/51665520964965" frameborder="0" style="width:100%; height:539px; border:none;" scrolling="no"></iframe>

<script type="text/javascript">window.handleIFrameMessage = function(e) {var args = e.data.split(":");var iframe = document.getElementById("JotFormIFrame");if (!iframe)return;switch (args[0]) {case "scrollIntoView":iframe.scrollIntoView();break;case "setHeight":iframe.style.height = args[1] + "px";break;case "collapseErrorPage":if (iframe.clientHeight > window.innerHeight) {iframe.style.height = window.innerHeight + "px";}break;case "reloadPage":window.location.reload();break;}};if (window.addEventListener) {window.addEventListener("message", handleIFrameMessage, false);} else if (window.attachEvent) {window.attachEvent("onmessage", handleIFrameMessage);}</script>

After (the one that I will add in Wix):

<iframe id="JotFormIFrame" allowtransparency="true" src="//form.jotformpro.com/form/51665520964965" frameborder="0" style="width:100%; height:539px; border:none;" scrolling="no"></iframe>

So basically, I removed all the bold text in the default iFrame code. 

Let us know if that works.

Thank you.

Hi-

Thanks for getting back to me.  I checked everything that you provided and it did not work. 

I do have to note that at first, half of my form was cut off with the pixels that were found in the code. (on mobile)  I manually increased the number on the code and by 1000 pixels, and the full form began to show on my mobile device. 

Unfortunately, when I went to go and test the form, it still locked up for me. 

Do you have any other suggestions?

Hi -

Just an update here.  I fixed this issue, so I wanted to reply for other users. 

If you go to the mobile editor view in your Wix account, you need to make sure that your make updates to some of the areas in your site (including an Jotform iframe).  All I did was click on the bottom of the HTML embedded box around the form and pull it down. 

See my screenshot.