Time dropdown doesn't show up for users

  • Profile Image
    LongwoodRCL
    Asked on September 01, 2015 at 04:22 PM

    I have a date/time selector in one of my forms. The form works correctly; however, the time selector doesn't allow the user to see what they have selected. They can click the dropdown, see the time, & select them; however, it doesn't show up in the boxes after being selected. (See where my mouse is located on the screenshot. This is an example of how the boxes look even if times are selected.) It does submit in the form, however. I've received complaints from users as they are unable to verify that they have selected the appropriate time. I've tried to change multiple things in the designer, but have been unable to solve the issue. Can someone please assist with this cosmetic issue?  

  • Profile Image
    victor
    Answered on September 01, 2015 at 07:53 PM

    Hello,

    To adjust the with of the time field, please add the following CSS code:

     

    .allowTime span:not(.form-sub-label-container) > .form-sub-label-container {

        width : auto !important;

    }

     

    This can be by injecting CSS Code.

    Regards

    Victor M Larrea

  • Profile Image
    LongwoodRCL
    Answered on September 02, 2015 at 09:49 AM

    I tried this & it pushed the AM/PM area to a separate line which wasn't attractive. I split the date & time into two separate entries now with the same CSS applied. The issue is now not present for the time numbers but is still present for the AM/PM indicator. Is there a true fix for this?? 

  • Profile Image
    victor
    Answered on September 02, 2015 at 10:36 AM

    Hi,

    You can adjust the width of the AM/PM field by inserting the following CSS code.

    Please let us know if this helps.

    Regards

    Victor M Larrea

  • Profile Image
    LongwoodRCL
    Answered on September 02, 2015 at 12:08 PM

    I'm not a programmer & not highly familiar with coding. Can you please provide this CSS text in a copy & paste format as you did previously? I tried to input it myself & could not get it to work properly. Thanks! 

  • Profile Image
    victor
    Answered on September 02, 2015 at 01:04 PM

    Hi,

    You can copy and paste the following CSS code using the instruction form our users guide, injecting CSS Code.

    #input_40_ampm {

    width: 70px !important;

    }

    Please let us know if you require our assistance.

    Regards

    Victor M Larrea

  • Profile Image
    LongwoodRCL
    Answered on September 17, 2015 at 06:39 PM

    This issue is presenting itself in MULTIPLE forms. The coding provided is very hit or miss on resolving the issue & often takes considerable "tweaking." Will this issue ever be fully resolved WITHOUT the need for those of us who are not as code savvy having to take additional measures? It is very frustrating. 

     

    This form is also presenting with the same issue: http://www.jotformpro.com/form/51465721449964 (I put in the same code as above & the issue IS NOT resolved. PLEASE HELP!!!)

  • Profile Image
    Chriistian
    Answered on September 18, 2015 at 05:48 AM

    Hi,

     

     

    I checked your account and I was able to see that the AM/PM is not properly displayed. Can you try to inject this custom CSS code in your form?

    select#input_30_ampm {

        width: 80px !important;

    }

    select#input_29_ampm {

        width: 80px !important;

    }

     

    Do let us know if you need further assistance.

    Regards.

  • Profile Image
    LongwoodRCL
    Answered on September 18, 2015 at 02:20 PM

    This made 1 AM/PM partially viewable. It is still cut off partially. The AM/PM is still not viewable at all. Is there a solution? This is happening on all new forms I create as well as this particular form which is heavily utilized by my business.  http://form.jotformpro.com/form/51465721449964 

  • Profile Image
    Welvin
    Answered on September 18, 2015 at 06:00 PM

    I've fixed it for you by replacing the custom CSS codes with the following:

    #input_39_ampm {

    width: 60px;

    }

    #input_30_ampm {

    width: 60px;

    }

    .form-dropdown {

            -webkit-padding-end: 0;

    }

    Thanks

  • Profile Image
    Welvin
    Answered on September 18, 2015 at 06:03 PM

    By the way, the codes in my reply is just for this form: http://form.jotformpro.com/form/51465721449964. You cannot use it to the other form. If you need help with the other forms, please let us know the URL's here so we can check it for you.

    Thanks

  • Profile Image
    LongwoodRCL
    Answered on September 21, 2016 at 09:29 AM

    I am encountering this issue again with a new form. I have 10 date & time entries on the form. The AM/PM bar will not show up properly for them even though there is plenty of space. Can someone please assist?

    https://form.jotform.com/62594623233961

  • Profile Image
    Chriistian
    Answered on September 21, 2016 at 11:24 AM

    Hi LongwoodRCL,

     

    I have moved your concern on a separate thread so we can better assist you. We will attend to your concern on the new thread created accordingly. You can check the thread here: https://www.jotform.com/answers/938045.

     

    Regards.