Form not scrolling on mobile device

  • vinjack
    Asked on January 19, 2016 at 8:38 AM
    what would cause the form not to scroll all the way when viewing it on a mobile device?
  • BJoanna
    Replied on January 19, 2016 at 11:28 AM

    Please provide us ID of your form so that we can test it. If you have embedded your form to website then provide us URL of your website so that we can test your embedded form.

     

    If your form is not responsive that could be possible reason. Inside of this guide you can find out how to To Make Mobile Friendly Forms on JotForm:

    http://www.jotform.com/help/322-How-To-Make-Mobile-Friendly-Forms-on-JotForm 

    Looking forward to your reply. 

     

  • vinjack
    Replied on January 19, 2016 at 11:46 AM
    Hello and thank you for the reply -
    the ID is 60175693838164. I did go to the link, made the form responsive,
    published it, added the new code and published the site.
    Still doesnt seem to work on my end.
    Thank you in advance for your help
    Vinnie
    ...
  • BJoanna
    Replied on January 19, 2016 at 1:03 PM

    I have tested your form http://www.jotform.us/form/60175693838164 on my Samsung Galaxy S4 and your form is responsive and I was able to scroll it. 

    Form not scrolling on mobile device Image 1 Screenshot 30

    Form not scrolling on mobile device Image 2 Screenshot 41

    If I understood you correctly you have also embedded your form to your website. If so please provide us URL of your website so that we can test your form there. 

    Maybe you have embedded your form with script code and there are some script conflicts between jotform scripts and scripts from your website. We recommend using of iFrame code. Please try to embed your form with iFrame code to see if that will resolve your issue. Inside of this guide you can find out how to get iFrame code of your form:

    http://www.jotform.com/help/148-Getting-the-Form-iFrame-Code 

    If iFrame code dose not help, please provide us URL of your website. 

    Hope this will help. Let us know if you need further assistance.

  • vinjack
    Replied on January 19, 2016 at 1:45 PM
    Ok I did use script - just tried the iframe and same thing. scrolls to
    about the middle of the address section.
    ...
  • vinjack
    Replied on January 19, 2016 at 1:45 PM
    the url is http://www.scituateyouthdrama.com/summer-camp.html
    ...
  • BJoanna
    Replied on January 19, 2016 at 3:03 PM

    I have tested your embedded form and I was able to replicate mentioned issue. I was not able to scroll to the bottom of the form. It seems that the part of the form is cut off. 

    To resolve this issue please try to increase height if you iFrame code. You can also try to set scrolling to yes. Set height to 2410px!important

    <iframe id="JotFormIFrame" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotform.com/60175693838164" frameborder="0" style="width:100%; height:2410px!important; border:none;" scrolling="yes">

    Don't change anything inside of script code.

    If this dose not help, try to remove script tags and everything between scripts tags and leave only iFrame part of the code. 

    Hope this will help. Let us know if you need further assistance.

  • vinjack
    Replied on January 19, 2016 at 3:45 PM
    Ok, I set the height to 2410. changed scrolling to yes. Nada. Took out the
    ...
  • Steve VP of Sales Operations
    Replied on January 19, 2016 at 5:51 PM

    Hello,

    It looks like your message was cut off, perhaps since it included an image.

    If you need further assistance please update this thread, or if it's a new questions please open a new one.

    best

  • vinjack
    Replied on January 20, 2016 at 12:45 PM
    Hello again -
    I have tried everything mentioned to get my form to scroll on a cell phone.
    I am not doing to well.
    http://www.scituateyouthdrama.com/summer-camp.html
    ...
  • BJoanna
    Replied on January 20, 2016 at 2:14 PM

    I see that your iFrame code is embedded inside of element #wsb-element-fefdea8c-3157-4896-9eaf-6fbd34a4a339 .wsb-htmlsnippet-element 

    Form not scrolling on mobile device Image 1 Screenshot 20

    Please try to change height of that element to 2400px. 

    #wsb-element-fefdea8c-3157-4896-9eaf-6fbd34a4a339 .wsb-htmlsnippet-element {

        width: 955px;

        height: 2400px;

        overflow: hidden;

        margin: auto;

    }

    and set you iFrame code like this:  

     

    <iframe id="JotFormIFrame" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotform.com/60175693838164" frameborder="0" style="width:100%; height:2010px; border:none;" scrolling="yes"> </iframe>

    If this does not help, then remove the inline style completely of element wsb-canvas-template-container

    Hope this will help. Let us know if you need further assistance. 

  • vinjack
    Replied on January 20, 2016 at 2:45 PM
    Ok, i changed the height, but cant see where I can delete the
    wsb-canvsa-template-container
    ...
  • Kiran Support Team Lead
    Replied on January 20, 2016 at 7:43 PM

    It seems that you have linked the form directly on your webpage instead of iframe embed. As I check the form on a mobile device, the form seems to be working fine. If you can embed the form on a separate webpage to test the issue, we would be happy to assist you further.

    Thank you!