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

    Hours field not showing

    Asked by beatsahead on February 16, 2016 at 03:35 PM

    I would appreciate help with where I have gone wrong as my hours field is not showing any options

    Page URL:
    https://eu.jotform.com//?formID=60413600299350#design

    field not showing hours
  • Profile Image

    Answered by Huberson on February 16, 2016 at 06:31 PM

    Hi,

    I have noticed you have two 'Time' fields on the form and assume you are referring to the second one.  

    It appears that you have a condition that show the hours based on the state of a hidden one. Unless the value 'Peak' is equal to 'mid' the 'Time' field will never display.

    There is also condition with missing field which might cause your logic not to work properly.

    If you need the 'Time' field to be always visible you can remove the condition associated with it.

     

    Thanks!

     

  • Profile Image

    Answered by beatsahead on February 16, 2016 at 06:46 PM
    I can see the condition is wrong, but it was not to update the time field.
    . the hours show up if I take off the margin setting in CSS
    ...
  • Profile Image
    JotForm Support

    Answered by Chriistian on February 17, 2016 at 01:17 AM

    I checked your form and I can see that the second hours field are displayed depending on the right condition. Do you mean the hour label does not show properly, as seen in the screenshot below?

    Allow me to investigate this issue further and I will get back to you with a possible fix using css. 

  • Profile Image
    JotForm Support

    Answered by Chriistian on February 17, 2016 at 02:45 AM

    Please inject this custom css to fix the appearance of the hour label in the second hour field.

    label#sublabel_hour {

        margin-left: 0px;

        margin-top: 5px;

    }

    label#sublabel_minutes {

        margin-left: 0px;

    }

    span.date-separate{

     display:none;

    }

    Simply follow this guide on how to inject the css: How To Inject Custom CSS

    This is how the date field should look after.

    You can check out the cloned form where I tested the css by following this link: https://www.jotform.com/60413600299350

    You can also clone it to your account by following this guide: How to Clone a Form

    Do let us know if you need further assistance.

  • Profile Image

    Answered by beatsahead on February 17, 2016 at 03:46 AM
    I checked your cloned form and it has the same problem.
    The drop down does not open for the hours but it does for the minutes.
    I don't need the am/pm it is a 24 hour clock
    ...
  • Profile Image
    JotForm Support

    Answered by beril on February 17, 2016 at 09:49 AM

    Thank you for your response. I am able to reproduced the same issue that you are having. Hour dropdown field doesn't open on my side.

    However, we can solve that issue easily. You can duplicate that field and delete the field which is not working. At that time it will work properly.

    Here is how it works:

     

    In addition to that, if you want to use your field in  24 hour format. you can choose 24 Hour option instead of AM/PM.

  • Profile Image

    Answered by beatsahead on February 18, 2016 at 05:50 AM

    the hours does show in the duplicated box, until i change position and size to be as I would like it and then it does not show

  • Profile Image
    JotForm Support

    Answered by beril on February 18, 2016 at 07:52 AM

    Thank you for your response. I've realized what is the real issue on your time field.

    Here is how it works with CSS:

    The issue occurs due to location of .form-sub-label-container. 

    Let me try to solve that issue. I will fix it and get back to you as soon as possible.

     

  • Profile Image
    JotForm Support

    Answered by beril on February 18, 2016 at 08:33 AM

    I've changed the some of your CSS codes on your cloned form.

    If you add the CSS code below it will work properly.

     

    .form-section.page-section {

        text-align : center;

    }

    .form-label.form-label-top {

        text-align : center;

    }

    #ddResult {

        display : none;

    }

    input#input_124 {

        font-size : 25px !important;

    }

    .form-radio-item {

        text-align : left;

    }

    .form-dropdown {

        height : 40px;

    }

    .form-textbox {

        height : 40px;

        font-size : 25px;

    }

    #cid_124 {

        margin : 0 0 0 250px;

    }

    #cid_243 {

        height : 40px;

        margin-left : 150px !important;

    }

    #input_243_hourSelect {

        width : 130px;

        font-size : 25px;

    }

    #input_243_minuteSelect {

        width : 80px;

        font-size : 25px;

    }

    #cid_243 span.date-separate {

        display : none;

    }

    #sublabel_minutes {

        margin : 5px 0 0 130px;

    }

    #cid_80 {

        max-width : none !important;

    }

    #input_80 {

        font-size : 25px;

        width : 350px;

    }

    #sublabel_hour {

        margin : 0 0 0 100px;

    }

    #cid_249 span.form-sub-label-container {

        margin-right : 50px;

    }

     

    label#sublabel_hour {

        margin-top : 5px;

    }

    label#sublabel_minutes {

        margin-left : 1px;

    }

    span.date-separate {

        display : none;

    }

    #cid_243 span.form-sub-label-container {

        margin-right : 50px !important;

    }

    label#sublabel_hour {

        margin-left : 25px;

    }

     

    Here is how it works:

    Feel free to clone it.

    https://form.jotform.com/60473471529964

    If there is something that you want to change please let us know. We will be glad to assist you