How do I put multiple drop-downs on the same horizontal line

I have found old instructions in this forum to use "shrink" to achieve this, but it doesn't work for me.

And many of the questions on this subject seem to date back to 2011 or 2012.

Could you please give me up-to-date instructions on how to achieve this.

FYI, my label would be "Start Date of Event" and I would have 3 dropdowns, the first of numbers 1 to 31, the 2nd of month names (Jan, Feb, Mar, etc), and the 3rd of years (2015, 2016, 2017, etc)

Thank you for contacting us.

The "shrink" field method should be still valid, but there is also a "Birth Date Picker" widget field available. It can be easily configured to have the dd/mm/yyyy drop downs format. Please take a look at the following animation.

If you need any further assistance, please let us know.

Thank you, Mike.

The "Birth Date Picker" works OK for requesting a date input (I have found that the standard date picker with a calendar causes problems when viewed for example on an iPhone 4) so that's OK.

However, I now need to add a single line for my users to enter a Time, and I wanted to do that with 3 dropdowns: hours (1 to 12), minutes (:00 to :55) and AM/PM/Midnight/Noon.

I have created three such dropdowns, but the "shrink" method is useless. Each one appears on a separate line.

Each field has its own title, margins and paddings, and there is no way to combine multiple fields into one.

We can do something similar with CSS injections to adjust the fields positions, but it will be specific to the form.

It might be a better idea to use existing control instead. For example there is a Time field.

Custom format is possible with Configurable List Widget.

Used values:

Hour : dropdown : 12,1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12 : Please Select

Minute : dropdown : 00, 05, 10, 15, 20 : Please Select

AM/PM : dropdown : AM, PM, Midnight, Noon : Please Select

Thank you.

Thanks.  I tried the "Configurable List Widget" but I have 2 problems:

-- there is an "Add" button which adds another row. I don't want that, and I can't see how to prevent it from appearing.

-- the 3 dropdowns are not on the same line as the label, but are below it.

-- there is an "Add" button which adds another row. I don't want that, and I can't see how to prevent it from appearing.

You can prevent that by entering the same number for minimal and maximum rows number. 1 in your case.

-- the 3 dropdowns are not on the same line as the label, but are below it.

Please try to inject the following CSS code to the widget's custom CSS text area:

#listContainer {
margin-top: -18px;
padding-top: 0
}

This is the final result:

You can see it live here: http://form.jotformpro.com/form/50557810089964 feel free to clone this form to your account if you want to.

Thank you

Thank you. Those 2 fixes seem to have worked.  I'll be doing some cross-browser/iPhone testing later today, and I'll come back to you if that raises any other problems.

Otherwise, this looks like a very neat widget. A shame it's not part of "Form Tools" where it would be easier to find, and that old answers in the forum about putting multiple fields on one line aren't updated to reflect its existence.

Thanks again.    Philip

Hi Philip,

Thanks for your feedback, we currently have a lot of widgets that is why they are not visible in the Form Tools, and our Widget team updates them regularly and add new ones from time to time. You can check them here: http://widgets.jotform.com/. 

Please do update us regarding the result of your tests so that we can assist you further if you need more adjustments on it.

Thank you.