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.


  • Profile Image

    Why my form is not showing on mobile devices?

    Asked by packleadersdogtraining on June 20, 2016 at 12:04 PM
    Page URL:
    http://www.packleadersdogtraining.com/group-sessions-calendar.html

    JotForm Mobile devices how
  • Profile Image
    JotForm Support

    Answered by Nik_C on June 20, 2016 at 01:44 PM

    I checked your form on my iPad and in phone simulator, it is showing fine as you can see below:

    Could you please try to re-embed your form if the issue persists.

    Do get back to us if you are still experiencing the problem you have.

    Thank you!

  • Profile Image

    Answered by packleadersdogtraining on June 20, 2016 at 04:45 PM
    This is how it is coming up on my Android. One of my clients is who alerted
    me to this, so I know it's not just my phone.
    The jotform should be just underneath "Woof!" I have re-embedded the code
    but that didn't change anything.
    Any other ideas?
    *Angie Scharpf*
    Owner/Lead Trainer
    Pack Leaders Dog Training LLC
    Serving Cedar Rapids, Marion, and surrounding areas
    Cell 319.350.3230
    Fax 319.373.3802
    www.PackLeadersDogTraining.com
    Like PLDT on FACEBOOK!

    Check us out on Google +

    ...
  • Profile Image

    Answered by victor on June 20, 2016 at 07:12 PM

    I have just tested your site and did noticed that there is a blank space where the form should be. I tested it on my personal mobile phone and on online emulators.

    Can you try to re-embed the form using the following code

    <iframe

          id="JotFormIFrame"

          onload="window.parent.scrollTo(0,0)"

          allowtransparency="true"

          src="https://form.jotform.com/12141729191"

          frameborder="0"

          style="width:100%;

          height:539px;

          border:none;"

          scrolling="no">

        </iframe>

     

    Please let us know if this helps.

  • Profile Image

    Answered by packleadersdogtraining on June 23, 2016 at 10:45 AM
    Still didn't work. When I embed that code it only shows half of the form
    with no option to scroll. See the screenshot attached.
    Any other ideas?
    Thanks
    *Angie Scharpf*
    Owner/Lead Trainer
    Pack Leaders Dog Training LLC
    Serving Cedar Rapids, Marion, and surrounding areas
    Cell 319.350.3230
    Fax 319.373.3802
    www.PackLeadersDogTraining.com
    Like PLDT on FACEBOOK!

    Check us out on Google +

    ...
  • Profile Image
    JotForm Support

    Answered by Kevin_G on June 23, 2016 at 12:09 PM

    Apologies or that, the iFrame code given has not the enough height, but try injecting this code: 

    <iframe

     

          id="JotFormIFrame"

     

          onload="window.parent.scrollTo(0,0)"

     

          allowtransparency="true"

     

          src="https://form.jotform.com/12141729191"

     

          frameborder="0"

     

          style="width:100%;

     

          height:2249px;

     

          border:none;"

     

          scrolling="no">

     

        </iframe>

    If you notice this has a different value in the height property, please try embedding this code and let us know if it works. 

  • Profile Image

    Answered by packleadersdogtraining on July 11, 2016 at 06:45 PM
    Still didn't work. It is still cut off too short on the mobile site. See
    the attached screenshot.
    Sorry it took me so long to respond. What else can we do?? I've had a lot
    of clients complaining about this issue.
    Thanks,
    *Angie Scharpf*
    Owner/Lead Trainer
    Pack Leaders Dog Training LLC
    Serving Cedar Rapids, Marion, and surrounding areas
    Cell 319.350.3230
    Fax 319.373.3802
    www.PackLeadersDogTraining.com
    Like PLDT on FACEBOOK!

    Check us out on Google +

    ...
  • Profile Image
    JotForm Support

    Answered by Kevin_G on July 11, 2016 at 08:02 PM

    I can see the form works fine on a desktop computer, but does not show completely in a mobile device, although the height is the same it is not enough, this should be resolved by injecting this CSS code in your webpage: 

    @media screen and (max-width: 480px){

        #JotFormIFrame{

            height: 3213px;

         }

    }

    This will se the proper height value to the form when it is loaded in a mobile device, please test it and let us know how it goes. 

    Here a screenshot about the expected result: 

  • Profile Image

    Answered by packleadersdogtraining on July 26, 2016 at 03:45 PM
    Sorry still not working. I tried to embed that last code you sent me but it
    didn't work.
    *Angie Scharpf*
    Owner/Lead Trainer
    Pack Leaders Dog Training LLC
    Serving Cedar Rapids, Marion, and surrounding areas
    Cell 319.350.3230
    Fax 319.373.3802
    www.PackLeadersDogTraining.com
    Like PLDT on FACEBOOK!

    Check us out on Google +

    ...
  • Profile Image
    JotForm Support

    Answered by Nik_C on July 26, 2016 at 04:35 PM

    Could you please try using the following iframe embed code:

    <iframe id="JotFormIFrame"

    onload="window.parent.scrollTo(0,0)"

    allowtransparency="true"

    src="https://form.jotform.com/12141729191"

    frameborder="0" style="width:100%;

    height:3000px;

    border:none;"

    scrolling="no">

    </iframe>

    Let us know if this worked for you.

     

  • Profile Image

    Answered by packleadersdogtraining on July 26, 2016 at 05:45 PM
    It worked on my mobile site- YAY! But now it's excessively long on my
    desktop version. Is there any way around that??
    *Angie Scharpf*
    Owner/Lead Trainer
    Pack Leaders Dog Training LLC
    Serving Cedar Rapids, Marion, and surrounding areas
    Cell 319.350.3230
    Fax 319.373.3802
    www.PackLeadersDogTraining.com
    Like PLDT on FACEBOOK!

    Check us out on Google +

    ...
  • Profile Image
    JotForm Support

    Answered by Kevin_G on July 26, 2016 at 07:18 PM

    That is because the form currently has a fixed value needed to show it completely on mobile devices, then when it is checked on a desktop computer the space is shown. 

    If you can inject CSS code to your webpage, then try injecting this code: 

    @media screen and (min-width: 480px){

        #JotFormIFrame{

            height: 2100px !important;

         }

    }

    This should reduce the space on a desktop device. 

    Once you have injected the code, if this still does not work, please do not remove the code and let us know, we will further check it and find why it does not work. 

     

  • Profile Image
    JotForm Support

    Answered by Kevin_G on July 26, 2016 at 07:36 PM

    I have found another way to resolve this as well. 

    First you will need to remove the height property from the iFrame code, embedding only this: 

      <iframe

          id="JotFormIFrame"

          onload="window.parent.scrollTo(0,0)"

          allowtransparency="true"

          src="https://form.jotform.com/12141729191"

          frameborder="0"

          style="width:100%;

          border:none;"

          scrolling="no">

        </iframe>

    Embedding this code, the form will not shown, now you will need to set up the height with some CSS code, if you can add HTML code to your form, please add this: 

    <style type="text/css">

    #JotFormIFrame{

           height: 2100px;

        }

     

    @media screen and (max-width: 480px), screen and (max-device-width: 768px) and (orientation: portrait), screen and (max-device-width: 415px) and (orientation: landscape){

       #JotFormIFrame{

           height: 3210px ;

        }

    }

    </style>

    If you have access to a style-sheet of your webpage then just add this code: 

    #JotFormIFrame{

           height: 2100px;

        }

     

    @media screen and (max-width: 480px), screen and (max-device-width: 768px) and (orientation: portrait), screen and (max-device-width: 415px) and (orientation: landscape){

       #JotFormIFrame{

           height: 3210px ;

        }

    }

    This will set the proper height to the iFrame embedded code showing it properly on a desktop as well as mobile device.

    I did this on a sample HTML webpage and it works, please take a look by clicking on this link

    I would suggest you to better try first with this second workaround. 

    Please let us know how it goes.