Why date time field is not being displayed properly on iPhone?

  • Profile Image
    BLADEOFGRASS
    Asked on March 02, 2016 at 03:11 PM

    I am revising some forms that I have used for quite some time by cloning them and modifying them.  One of these revised forms is not displaying on the iPhone the way that it used to.  The date and time fields are stretched out left to right.  See image attached.

     

     

  • Profile Image
    Kevin_G
    Answered on March 02, 2016 at 05:57 PM

    I have checked your form and tried to replicate your issue, I tested a lot of times and the date time field is working as it should.

    If the issue is still there, please follow this guide to make your form mobile responsive: http://www.jotform.com/help/311-How-to-make-Forms-Mobile-Responsive

    Do let us know if it works.

  • Profile Image
    BLADEOFGRASS
    Answered on March 05, 2016 at 04:05 PM

    Did you use an iPhone?

  • Profile Image
    EltonCris
    Answered on March 06, 2016 at 04:22 AM

    He uses iPhone simulator.

    I tried it on a physical iPhone device and I couldn't reproduce the problem.

    However, I noticed that the clear button expands to the right which makes some of the fields to extend its width as well.

    Please try to inject this CSS codes to your form, this should correct the button alignment on mobile.

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

    .form-submit-button,

    .form-submit-reset, 

    .form-submit-print{

    display:block;

    margin-top: 10px;

    }

    }

    Guide: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes (paste it at the bottom part if you have existing CSS codes in your form)

    Hope this helps!

  • Profile Image
    BLADEOFGRASS
    Answered on March 07, 2016 at 11:53 AM

    Injected this CSS code.  Didn't do a thing for my date and time fields.

  • Profile Image
    BLADEOFGRASS
    Answered on March 07, 2016 at 12:12 PM

    I changed "Responsive Form" under PREFERENCES and that seems to have resolved the problem.

  • Profile Image
    Kevin_G
    Answered on March 07, 2016 at 01:15 PM

    Yes, that was because that code was to fix the clear button. 

    It is great to know that the responsive feature resolved your issue, please do let us know if you need further assistance, we will be glad to help you.

  • Profile Image
    Rebecca 
    Answered on April 07, 2016 at 09:10 AM

    Hi. It's shrink and form is set res
    ponsive but when I tap on the date, it became like this. This is on iphone & ipad
  • Profile Image
    EltonCris
    Answered on April 07, 2016 at 10:16 AM

    @Rebecca, We will answer your question here https://www.jotform.com/answers/812724.