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

    Date Picker field is broken on mobile

    Asked by fondudes on May 02, 2017 at 01:54 PM
    but now the "Date Picker" element is broken on
    mobile. Please take a look at that and let me know what you think.
  • Profile Image
    JotForm Support

    Answered by BJoanna on May 02, 2017 at 02:36 PM

    Is your issue related to this form http://www.jotform.us/form/71198713579166?

    I have tested that form on my Samsung Galaxy S4 and DateTime field is working correctly. 

    I only noticed that minutes are cut off.

    To resolve this issue add this CSS code to your form:

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

    {

    select#ampm_12 {

        width: 80px!important;

    }

    }

    If you have some other issue with DateTime field, please provide us more details about your issue. Also tell us which device are you using and if possible provide us a screenshot of your issue. 

    If you have issues with some other form provide us ID of that form. If the form is embedded, please provide us URL of the webpage.

    Let us know if you need further assistance. 

  • Profile Image

    Answered by fondudes on May 02, 2017 at 04:43 PM
    Hi BJoanna,
    Thank you for the code to fix the minutes on the Date Picker, that was
    going to be my next question:) Yes indeed, that is the form I'm concerned
    with. I have been trying to get the background image to stay fixed while
    scrolling and the following CSS code was suggested:
    .supernova {
    background-repeat: no-repeat;
    background-attachment: fixed;
    }
    @media screen and (max-width: 480px){
    .supernova {
    background-image : url("https://www.jotform.com/
    uploads/fondudes/form_files/Payment%20Background%20(from%
    20Mobile%20Layer%20-%20How%20it%20Works-04).243.jpg

    ");
    background-size : cover;
    height : 100%;
    overflow : hidden;
    }
    body {
    height : 100%;
    overflow : scroll;
    -webkit-overflow-scrolling : touch;
    }
    }
    The code worked to keep the background image fixed but broke the Date
    Picker, so I've since removed the code. Do you have any idea why this code
    is causing the Date Picker to malfunction?
    ...
  • Profile Image
    JotForm Support

    Answered by Kiran on May 02, 2017 at 05:19 PM

    I have cloned your JotForm and tried adding the code provided by you. However, the issue with the date field is still occurring with or without this code. Please note that you can make the background fixed from the Background image section of advanced Form Designer. The code provided by our colleague applies to the particular date field only to increase the width.

    Hope this information helps!

  • Profile Image

    Answered by fondudes on May 02, 2017 at 06:43 PM
    Hello Kiran,
    Unfortunately, fixing the background using the advanced form designer
    doesn't work, which is how the conversation first began. Nik provided the
    code above, which worked but also caused the Date Picker to break.
    ...
  • Profile Image
    JotForm Support

    Answered by Kiran on May 02, 2017 at 06:55 PM

    Okay. I was checking the form on an Android device. When I checked the form on an iPhone emulator, I still see that the date field is not affected by the earlier code. However, could you try adding the both CSS codes to the form to see if that makes any difference?

    Please get back to us if the issue still persists. We will be happy to assist you further. 

  • Profile Image

    Answered by fondudes on May 03, 2017 at 03:43 PM
    Thank you Kiran. I did that and it appears to be malfunctioning the same
    way. The date fields are behaving as if a phone number is be entered in
    rather than a date, and the calendar doesn't pop up upon entry into any of
    those three fields: month, day or year. I have cloned the form with both
    pieces of CSS code injected and it can be viewed here:
    https://form.jotform.us/71225863779165
    ...
  • Profile Image
    JotForm Support

    Answered by Kiran on May 03, 2017 at 05:38 PM

    I have cloned your JotForm and able to replicate the issue that you are experiencing. Pease allow me some time to check on this and get back to you with relevant information.

    Thank you for your patience. 

  • Profile Image

    Answered by fondudes on May 08, 2017 at 07:43 PM
    Hi Kiran, I'm looking forward to getting this fixed. Any updates?
    ...
  • Profile Image
    JotForm Support

    Answered by Kevin_G on May 08, 2017 at 11:05 PM

    @fondudes, 

    I have cloned your form and I can see the calendar pop up does not open on an iPhone even when the option is enabled in the date field. 

    However, I have deleted all the other fields, with only the date field the issue was still there, I have then added a new date picker and I can see it works, while the existing field still does not work. 

    You could test with this form: https://form.jotformpro.com/71278968947984 

    If this works on your end, you could also remove your current field and add a new one, this should work for the calendar not opening. 

    If there is any issue with the field layout, you could also share us a screenshot about it, this guide will help you to upload the image with your next reply: How-to-add-screenshots-images-to-questions-in-support-forum

    We will wait for your response. 

  • Profile Image

    Answered by fondudes on May 10, 2017 at 05:44 PM
    Hello Kevin,
    The operative problem is that the Date Picker calendar won't work when
    scrolling is enabled, which I don't believe was reflected in your example.
    Moreover, the only way to enable scrolling so that it works is to inject
    the following code, which appears to be what is breaking the Date Picker
    calendar:
    .supernova {
    background-repeat: no-repeat;
    background-attachment: fixed;
    }
    @media screen and (max-width: 480px){
    .supernova {
    background-image : url("https://www.jotform.com/u
    ploads/fondudes/form_files/Payment%20Background%20(from%20Mo
    bile%20Layer%20-%20How%20it%20Works-04).243.jpg

    ");
    background-size : cover;
    height : 100%;
    overflow : hidden;
    }
    body {
    height : 100%;
    overflow : scroll;
    -webkit-overflow-scrolling : touch;
    }
    }
    Please let me know what can be done. Thank you!
    ...
  • Profile Image
    JotForm Support

    Answered by Kevin_G on May 10, 2017 at 08:36 PM

    Thank you for the code, I have injected it now to my sample form and I cannot replicate the issue, I have even renamed the second field exactly like the first one and set the same properties. 

    If you check on my form you can see that the date picker opens properly when you tap on the second date field.

    Could you please check again on your end and let us know if you see the same behavior? 

    Here's my form: https://form.jotformpro.com/71278968947984 

    Here's on the first date picker field, the one where you're experiencing the issue: 

    Here's a screenshot from the second field I have added to the form and you can see the calendar pop-ups properly: 

    Please, let us know how it goes on your end. 

    Looking forward to your response. 

  • Profile Image

    Answered by fondudes on May 10, 2017 at 09:43 PM
    Hello Kevin,
    I noticed your background is not fixed in one place. The issue began upon
    trying to fix the background in one place while the content of the form
    scrolled in the foreground. That's what broke the calendar on the Date
    Picker. Nonetheless, your example still seems not to work on iPhone 6 for
    some reason. I've attached a screenshot to illustrate. Also, to hold all
    else constant, it may help us to replicate the form entirely and go from
    there. The content of your form wasn't enough to demonstrate scrolling more
    than a single screen length.
    ...
  • Profile Image
    JotForm Support

    Answered by Chriistian on May 11, 2017 at 02:15 AM

    Did you attach a screenshot image of the issue? It seems that the screenshot your have attached did not reach our Forum. For us to properly view, please open this thread: https://support.jotform.com/answers/1134183 on a browser and follow this guide on How to add screenshots/images to questions to the support forum?

    We'll wait for your response.
    Regards.

  • Profile Image

    Answered by   on May 11, 2017 at 07:05 AM

     

  • Profile Image

    Answered by fondudes on May 11, 2017 at 07:43 AM
    Thank you Chriistian, the screenshot has been attached. In this screenshot
    I have simply scrolled the form down about one finger's width. Notice that
    where the bottom border of the screen was before scrolling breaks both the
    calendar and the background. In Kevin's example the form isn't long enough
    to demonstrate what's been happening with my form but, if it were longer,
    you wouldn't see the calendar at all, as it would be below the bottom
    border in it's entirety. Scrolling would reveal nothing except a break in
    the background at that horizontal.
    ...
  • Profile Image
    JotForm Support

    Answered by seth on May 11, 2017 at 09:07 AM

    Hello, I checked your form "http://www.jotform.us/form/71198713579166" on an iPhoe simulator. I cloned it and fixed the background, and I can replicate the issue.

    The issue here si that the fix checkbox on the Advanced Designer should fix the background image on mobile devices.

    I am escalating the issue to our developers. We will notify you via this thread when we fix the issue.

    Thank you very much for reporting it.

    All the best.

     

     

  • Profile Image

    Answered by fondudes on May 15, 2017 at 02:43 PM
    Hello Seth, any updates on this?
    ...
  • Profile Image
    JotForm Support

    Answered by BJoanna on May 15, 2017 at 03:09 PM

    Unfortunately this issue is still not resolved. One of our developers is assigned to this thread and priority of this issue is set to important. Once this issue is resolved we will inform you via this thread.

  • Profile Image

    Answered by fondudes on May 30, 2017 at 07:43 PM
    Hello, it's been a couple weeks. I'm just curious as to whether or not this
    issue has been resolved. Thanks!
    ...
  • Profile Image
    JotForm Support

    Answered by Chriistian on May 30, 2017 at 08:47 PM

    We haven't heard back any updates from the developers. I will ask an update from them. Rest assured your will be informed in this thread if there are any updates on this issue.

    Regards.