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

    Form not Displayed Correctly: Mobile

    Asked by coffygroup on April 21, 2014 at 01:57 PM
    Mobile
  • Profile Image
    JotForm Support

    Answered by Mike_T on April 21, 2014 at 03:40 PM

    Please provide us with the URL in question, so we will check the page from our side. Also, information about your mobile device might help in our investigation.

  • Profile Image

    Answered by coffygroup on April 21, 2014 at 06:04 PM

    http://www.hubaxis.com/drmoche/contact-dr-moche/

  • Profile Image

    Answered by Cesar on April 21, 2014 at 10:22 PM

    I have tested the URL you have provided on iPhone5s iOS 7.0. But I do not see any problems with the way the form is being rendered. Please provide more information on what you are experiencing. So that we may assist you further.

    In any case I do suggest to use the iFrame Embed Method instead of the Standard Script Method you are currently using. This change should help avoiding any conflicts with other elements on your page.

    Do let us know if you need further assistance. Thank you.

    Screenshot of Test:

    https://shots.jotform.com/cesar/screens/formtestiphone5s7.1.png

  • Profile Image

    Answered by coffygroup on April 22, 2014 at 02:51 PM
    Please view the attached screenshot
    Cheers,
    *Chase Buckner*
    Director of Operations
    862.757.8055
    ...
  • Profile Image
    JotForm Support

    Answered by KadeJM on April 22, 2014 at 04:20 PM

    I am sorry, but we do not see any attached screenshot. Please use Our Image Repository then Our Image Tool to insert your screenshot. Alternatively, you can use a service like Imgur and simply copy then paste the image here as part of your answer.

  • Profile Image

    Answered by coffygroup on April 22, 2014 at 04:51 PM
    Just sent via repository. It's called jotform mobile view
    Cheers,
    *Chase Buckner*
    Director of Operations
    862.757.8055
    ...
  • Profile Image
    JotForm Support

    Answered by Welvin on April 22, 2014 at 07:54 PM

    Please get the link of the uploaded image and paste it here instead. We cannot check the image as we do not have an access to our repository. 

    Please review this guide on how you can add the screenshot to our support forum: http://www.jotform.com/answers/277033.

    Thanks

  • Profile Image

    Answered by coffygroup on April 23, 2014 at 11:11 AM
    You don't have access to your own image repository???
    https://cms.jotform.com/uploads/image_upload/image_upload/coffygroup/25618_jotform-mobileview.jpg
    Cheers,
    *Chase Buckner*
    Director of Operations
    862.757.8055
    ...
  • Profile Image

    Answered by EliezerN on April 23, 2014 at 12:49 PM

    Thanks for sharing the link of the image. However, we cannot reproduce the issue yet, the form is displaying correctly:

    Could you please let us know if you have tried to view your form in a real mobile device? If not please give it a try if possible. Most of the times the emulators are not completely accurate.

    Please give it a try and let us know if the issue still appears.

    Thanks

  • Profile Image

    Answered by coffygroup on April 23, 2014 at 01:51 PM
    The screenshot we sent is from a Galaxy S3. It does respond on iPhone
    correctly.
    Cheers,
    *Chase Buckner*
    Director of Operations
    862.757.8055
    ...
  • Profile Image

    Answered by EliezerN on April 23, 2014 at 03:27 PM

    Thanks for the clarification and I apologize for not being aware of that.

    So, it seems that the issue is just with Androids. I was able to reproduce the issue at this time:

    Please try injecting this CSS code to your form: 

    @media only screen 

    and (min-device-width : 320px) 

    and (max-device-width : 480px) 

    {

    .form-all 

    {

    width: 400px !important;

    height: 530px!important;

    }

    Here is how to inject CSS codes to forms: How to inject custom CSS codes

    I hope that helps. Please inform us if the issue still persits.

    Thanks

  • Profile Image

    Answered by coffygroup on April 23, 2014 at 04:21 PM
    Thanks for your reply. We have injected the CSS, saved form, and are using
    iFrame source, but the issue still persists. See screen shot from S3 phone:
    https://cms.jotform.com/uploads/image_upload/image_upload/coffygroup/25629_Screenshot_2014-04-23-16-01-07.png
    Cheers,
    *Chase Buckner*
    Director of Operations
    862.757.8055
    ...
  • Profile Image
    JotForm Support

    Answered by Mike_T on April 23, 2014 at 05:38 PM

    In this case, there is an issue with the iFrame height in Android browser.

    We can directly increase the height via iFrame code, but this will actually increase the height on every browser:

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

    As an alternative, we can try to increase the height on mobile browsers only. If you have access to the following stylesheet:

    http://www.hubaxis.com/drmoche/wp-content/themes/care/css/mobile-all.css

    Add the following code (highlighted in yellow) before the last closing curly bracket }.

    #footer-widget-area #first, #footer-widget-area #third, #footer-widget-area #second, #footer-widget-area #fourth{
    margin-right: 10px; margin-left: 10px;
    }

    /* Fix for JotForm iFrame on Android */
    #JotFormIFrame {
    min-height: 700px !important;
    }

    /* End of fix */

    }

    Thank you.

  • Profile Image

    Answered by coffygroup on April 24, 2014 at 03:21 PM
    Applied the CSS fix Jotform sent over. Not working entirely.
    Portrait view cuts off the right side of the form and does not display
    submit button.
    Landscape display shows nothing below first form fields and are cut off on
    right as well.
    Screenshots right off my phone.
    Cheers,
    *Chase Buckner*
    Director of Operations
    862.757.8055
    ...
  • Profile Image
    JotForm Support

    Answered by Mike_T on April 24, 2014 at 05:41 PM

    It works better in Google Chrome of my Android phone, but it seems that default Android browser on the Galaxy S3 uses other styles based on the device-width.

    Lets try to fix the portrait mode. Please replace your current injected form CSS code with the following styles:

    @media only screen and (min-device-width : 719px) and (max-device-width : 721px) and (-webkit-min-device-pixel-ratio : 2) and (orientation : portrait) {
    .form-all {
    width: auto !important;
    }
    .form-label-left {
    float: none;
    display: block;
    }

    Also, please add mentioned in previous post fix for iFrame height into 'MOBILE LANDSCAPE' section of http://www.hubaxis.com/drmoche/wp-content/themes/care/css/mobile-all.css file.

    /* Fix for JotForm iFrame on Android */
    #JotFormIFrame {
    min-height: 700px !important;
    }
    /* End of fix */