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

    Configurable List widget

    Asked by Jessica Jones  on July 15, 2016 at 07:59 PM

    I'm still experimenting with different form builder sites and i like this one the best because of its configurable list widget.  however, i need 4 fields: course, grade level, date, and time.  the date and time fields are very wide and i am wondering if there is a way to make them smaller, so that all four of those fields fits in one row.  OR i'm wondering if i can get all four of those fields in two rows, but with an add button so that a user can add those same four fields again and again.  is either option this possible?

     

    thanks!

    configurable list list widget configurable Form Builder date and time different builder
  • Profile Image
    JotForm Support

    Answered by Chriistian on July 16, 2016 at 12:10 AM

    Hi,

    I am currently checking your form. I will be back as soon as I solve the problem.

  • Profile Image
    JotForm Support

    Answered by Chriistian on July 16, 2016 at 12:24 AM

    You can try injecting the following custom CSS to your form.

    td.col2 input[type="text"], td.col1 input[type="text"] {

       width: 180px;

    }

     

    th.col4 {

       display: none;

    }

     

    td.col4 {

        position: absolute;

        margin-top: 25px;

        left: 372px;

    }

     

    #listContainer tr {

       margin-bottom: 20px;

    }

     

    td.col1,

    td.col2 {

       height: 45px;

    }

     

    To inject custom css to your form, please see Customize Your Form Using Custom CSS Codes.

     

    You can then change the heading of the third column to Date/Time.

     

    The result of these should be as follows.

     

    You may check and clone my form https://form.jotform.com/61969222664969.

  • Profile Image

    Answered by lyricolorado on July 16, 2016 at 01:45 AM
    Thank you!
    Sent from my iPhone
    ...
  • Profile Image
    JotForm Support

    Answered by Jan on July 16, 2016 at 09:00 AM

    On behalf of Christian, you are welcome. Let us know if you need any help. Thank you.