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 is getting cut off in iPhone & iPad device.

    Asked by iabove on October 14, 2015 at 01:15 AM
    Hi Nicholas,
    Thank you with your help with this, I really appreciate it.
    Issue 2 is definitely fixed. Issue 1 also appears to work ok.
    Issue 3 is the remaining problem. If you go to my web page to forms, the 'consent form' seems to work fine on a mobile device. The 'pre-flight assessment form' doesn't.
    Here are some screen shots from both an iPhone and iPad.
    I have checked all the css code and both forms seem to be the same, so I don't understand why it is just this form that is the problem.
    Any ideas?
    Kind regards

    027 426 6121

    paul@iAbove.co.nz

    www.iAbove.co.nz

    FARM MAPPING / ADVENTURE SPORTS / EMERGENCY RESPONSE
  • Profile Image

    Answered by Sammy on October 14, 2015 at 08:42 AM

    Your issue has been forwarded to our developers for investigation.

    It appears the screenshots were not successfully attached, do you mind re-uploading them again?

     

  • Profile Image

    Answered by iabove on October 14, 2015 at 04:45 PM
    God this is ridiculous!
    This was the original problem in the very beginning. I suppose it will be another 3 weeks before some looks at it?
    Here they are again for the third or forth time.

    027 426 6121

    paul@iAbove.co.nz

    www.iAbove.co.nz
    FARM MAPPING / ADVENTURE SPORTS / EMERGENCY RESPONSE
    ...
  • Profile Image
    JotForm Support

    Answered by EltonCris on October 14, 2015 at 08:29 PM

    Does it display like this on your iPhone?

    If yes, try to inject this CSS on your pre-flight form and see if this helps.

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

    .form-all{box-sizing:border-box;}    

    .form-line {

        padding: 0 2% !important;

        margin-top: 6px !important;

        margin-bottom: 6px !important;

    }

    .form-pagebreak-back-container {

    padding: 4px 3px 4px 0 !important;

    }

    #cid_51 .form-pagebreak-back-container {

        display: none !important !important;

    }

    .form-label {

        width: 100%!important;

        display: block !important;

        float: none !important;

    }

    .form-label.form-label-auto {

        display: block;

        float: none;

    }    

    .sigPad,.sigWrapper{width: 313px !important;}

    canvas.pad {

        width: 100% !important;

        height: 100% !important;

    }

    .form-all {padding-top: 0;}

    .form-pagebreak-next-container {padding: 0;}

    /*remove date huge space*/

    [data-type="control_datetime"]{width:100%}

    [data-type="control_datetime"] .form-sub-label-container {width: 20%;}

    }

    Hopefully this temporary fix will work while the assigned developer is still looking at this. Once there's any update from the dev about this, you will be informed here.

  • Profile Image

    Answered by iabove on October 20, 2015 at 08:45 PM
    Hi
    Yes that is how it is displaying. I have added the new css code and it does not make any difference at all.
    Kind regards

    027 426 6121

    paul@iAbove.co.nz

    www.iAbove.co.nz
    FARM MAPPING / ADVENTURE SPORTS / EMERGENCY RESPONSE
    ...
  • Profile Image
    JotForm Support

    Answered by EltonCris on October 20, 2015 at 10:32 PM

    @iabove

    Sorry I forgot to mention that it should be pasted at the bottom part of the existing CSS codes.

    I have now fixed it for your convenience. Kindly check your form again. Thanks!

  • Profile Image

    Answered by iabove on October 20, 2015 at 11:45 PM
    Hi
    Thank you for that. I did wander if it mattered where the code went. It does seem to be viewable now both on the iphone and ipad.
    Just so I know for any future forms, is there anything differently I could have done to make it work?
    Kind regards

    027 426 6121

    paul@iAbove.co.nz

    www.iAbove.co.nz
    FARM MAPPING / ADVENTURE SPORTS / EMERGENCY RESPONSE
    ...
  • Profile Image
    JotForm Support

    Answered by EltonCris on October 21, 2015 at 01:00 AM

    Glad to hear it's working now.

    For your future forms, here's how to make form mobile responsive. http://www.jotform.com/help/311-How-to-make-Forms-Mobile-Responsive

    Thanks!

  • Profile Image

    Answered by ml70sgirl on November 22, 2016 at 10:26 AM

    I'm going to paste this code at the end of my css as well. Mine is cutting off too. It is late November 2016. So what I'm getting here is that you guys haven't put a permanent fix on this problem yet. In regards to the link above, simply clicking the box to make the form responsive in "Designer / Layout" does not fix the issue FYI.

    In today's market, we definitely need quick forms that work properly. I am a web designer. It is an exceptionally important convenience for me to have access to wysiwyg forms like yours. However, there are more companies like yours who develop forms that work on mobile devices. Jotform is by far the nicest I've used. So I hope you can figure this problem out for my future continued business.

    Mandy

  • Profile Image
    JotForm Support

    Answered by david on November 22, 2016 at 12:04 PM

    Forms should work on mobile and be mobile optimized by default.  Setting the form to be mobile responsive will apply CSS to the form similar to what is described in this thread and will allow for the form layout to adjust on mobile devices.  This is for forms using the default layout and theme.

    Several things can cause mobile responsiveness in forms to be off.  Applying a theme to the form will add CSS, sometimes overwriting the mobile responsive CSS.  Embedding the form to a web page without using the iFrame embed code will subject the form to the CSS and scripts in that page.  This can also overwrite the mobile responsive CSS.  Certain styling changes can also overwrite the mobile CSS. 

    If you need assistance adjusting a form or anything specific parts of a form, open a new thread with the details and we will be happy to help.

  • Profile Image

    Answered by ml70sgirl on November 22, 2016 at 01:28 PM

    Hi David,

     

    I have too many things going on here with themes and whatnot for it to work with mobile devices. So I just went ahead and built a custom form on my own.

     

    Thanks for your quick response and help. Still hoping that themes and the like will not affect the forms in the near future. It takes almost as much time to fiddle with the code for these as it does just to build one from scratch at this point. I'm trying to eliminate headaches...not create them lol.

     

    Take care, and thanks again.

     

    Mandy