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

    Please help with formatting issues.

    Asked by iStore on December 10, 2016 at 06:00 PM

    My form doesn't have the right behavior when switching to landscape and specifically has the following problems:

    In Landscape:

    1. 'Tracking Number(s)' field gets cut off on the right side

    2. 'Time' field drops the minute selector down to the next line. We actually want the time field to move up to be aligned directly to the right of 'Tracking Number(s).

    3. Under 'Courier Information' Collapse - 'Fedex Station' field shrinks

    In both portrait and landscape, the 'Signature' field does not display correctly. In portrait mode the horizontal line is not centered within the signature box. In landscape mode we want the signature box to expand to take up most of the display but leave enough margin to be able to scroll using your finger. 

    Thanks for your assistance. If you notice other ways to improve the mobile user experience with this form please offer your suggestions. 

    Also,

    all submission this week have simply been to test the form functionality and not actually used in a 'production' environment. Is it possible to reset my submission count? As an aside, the client I am building this solution for opened a new paid account at my recommendation.  
    Page URL:
    https://form.jotform.com/iStore/xps-delivery-record

  • Profile Image
    JotForm Support

    Answered by Mike_G on December 11, 2016 at 03:47 AM

    We will be glad to help you with your concern, however, we may need some time to find the perfect solution for your issues. I will be working on it and I will update you here in this thread, as soon as possible, if I already have it.

    May I just know if there are any specific device where you're testing your form in landscape and portrait, please?

    Thank you.

  • Profile Image

    Answered by iStore on December 11, 2016 at 10:59 AM

    I am primarily using an iPhone 6 but this will be used on many different smart phones and even some iPads. 

  • Profile Image
    JotForm Support

    Answered by ashwin_d on December 11, 2016 at 11:23 AM

    Hello iStore,

    It seems my colleague @Mike_G is working on a solution for you. He will get back to you as soon as he is ready with the solution. I have also sent a message to him.

    Thank you!

  • Profile Image
    JotForm Support

    Answered by Mike_G on December 11, 2016 at 05:09 PM

    I'm sorry for the delayed response and if it took me some time to find a resolution for your issues.

    Below are the codes that should fix the issues you stated in your post.

    @media (min-width : 304px) and (max-width: 664px){

         .signature-line.signature-wrapper, .pad, .jSignature, #signature_pad_10{

              width: 100% !important;

         }

    }

    @media (min-width : 665px) and (max-width: 717px){

         .signature-line.signature-wrapper, .pad, .jSignature, #signature_pad_10{

              width: 100% !important;

    }     

    #cid_44{

              width: 50% !important;

         }

         #cid_44 select{

              width: 100% !important;

         }

         #id_48{

              width: 60% !important;

              display: inline-block !important;

    float:left !important;

    clear:both !important;

         }

         #cid_48 iframe{

              width: 100% !important;

         }

         #id_49{

              width:40% !important;

              display: inline-block !important;

              position:absolute !important; 

             float:right !important;

    clear:both !important;

         }

         #cid_49 .form-sub-label-container{

              width: 30% !important;

         }

    }

    The Custom CSS codes above needs to be injected in the form.

    https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    However, the one below needs to be added in the custom CSS tab of the Dynamic Textbox widget in your form.

    @media (min-width : 550px) and (max-width: 717px){

         input[id^="var"] {

             width: 85% !important;

         }

         p[id^="p"] {

             width:100% !important;

         }

         .removeVar{

             width: 25px !important;

         }

    }

    With regards to your other concern about resetting some of your submissions for this week that you have used for testing, I have moved it to a new thread to avoid confusion with the replies being given.

    Please click this link to go to the new thread.

    I hope the codes above helps. If you have other questions or concerns, please feel free to contact us anytime.

    Thank you.

  • Profile Image

    Answered by iStore on December 16, 2016 at 12:25 AM

    While I appreciate your effort, your suggested CSS created more problems than it fixed. 

    - Field heights were lost (shorter) 

    - Time field wasn't fixed

    - Signature capture became unusable

    and other problems.

  • Profile Image
    JotForm Support

    Answered by Welvin on December 16, 2016 at 03:07 AM

    I'm checking this now. I'll let you know later. 

  • Profile Image
    JotForm Support

    Answered by Welvin on December 16, 2016 at 03:34 AM

    Please check this form to your end and let me know if you need more adjustments: https://www.jotform.com/63501520001939. I cannot enumerate the changes so if the layout is now acceptable for you, you can just clone the form and use it.

  • Profile Image

    Answered by iStore on December 17, 2016 at 08:18 PM

    That is much better. A couple more adjustments if you don't mind. 

    1.

    Regarding the signature. If a record is started in portrait (page loaded in portrait) and then turned to landscape, the signature field gets very weird when signing. Weird behavior happens in reverse also. Hopefully you are able to test and duplicate to see what I mean.
     

    2. Extend the width of the 'Tracking #' field(s) to show 14 characters

    Because I have been with jotform since before you began limiting the number of forms, I am unable to clone forms. Is there something you can change with my account to allow this or can you include the complete CSS and I will replace all the CSS in mine.

    Thanks!

  • Profile Image
    JotForm Support

    Answered by Welvin on December 18, 2016 at 01:40 AM

    I cannot replicate the problem with the eSignature field. Is it when you start to sign it when a pen or your fingertip? What your device name and model/version? 

    I've fixed the tracking field. 

    Please check again and let me know if all good. I'll move the form to your account after.

  • Profile Image

    Answered by iStore on December 19, 2016 at 06:13 PM

    Hi Welvin - I have been testing with just my fingertip on iPhone 6 iOS 10.0.2. The drawn image doesn't follow the fingertip if rotated to other view after loading the page. 

  • Profile Image
    JotForm Support

    Answered by Chriistian on December 19, 2016 at 10:46 PM

    Hello iStore,

    To avoid any confusion regarding your latest response, I have moved the issue regarding the signature widget in landscape mode to a new thread. Please follow this link to view this thread: https://www.jotform.com/answers/1015630 

    Thank you.

  • Profile Image

    Answered by iStore on December 24, 2016 at 01:43 AM

    Yes Welvin, please go ahead and move it to my account. Thanks.

  • Profile Image
    JotForm Support

    Answered by BJoanna on December 24, 2016 at 02:55 AM

    I have moved the form https://www.jotform.com/63501520001939 that Welvin created to your account iStore.

    Let us know if you need further assistance.