Show Repeative fields

Hello Jotform team,

Can I build form for repeative fields ?  for example : I want to capture 4 series of "Employment History", please refer screenshot  >> http://prntscr.com/bmivjj Can I provide a "+" symbol, one clicked, subpage will be expanded (History2 / History3 ...).

Many thanks

Justin

Hi Justin,

If you want to let your user add the combination of the fields, when they click + symbol, it is possible with the configurable list widget. By that way, users will able to add those fields dynamically with one click. If you have any question or issues, please do not hesitate contacting us. We will be glad to assist you.

I've created a separate thread for you, so anyone in the support staff will be able to assist you with your specific requirement. Please follow up there:

https://www.jotform.com/answers/871728

Hello Beril,

Thanks your information, I have added widget and facing three issue.

For your information, I added Mobile Widget module. 

Pls refer screenshot : http://prntscr.com/bmxu9o

Q1) How to separate into 2 rows due to oversize in mobile version ?

I added 5 columns 

> Employment : Dropdown

> Other Employment : Free text field 

> Position : Free text field

> Period from : Month / Year

> Period to : Month / Year

Q2) in field4 / field5, Can I skip day field : e.g. MM/YYYY ?

Q3) Can I add some spaces between columns ? 

Many thanks

Justin

I am currently checking your form. Please allow me to investigate this further. I will get back to you as soon as I get the CSS code for your configurable list widget.

Can you please try to add this custom CSS code in your configurable list widget to fix the issue?

.checkbox, .radio {

margin: 3px 0;

min-width: 70px;

}

td.col1, td.col2, td.col3, td.col4, td.col5 {

display:inline-block;

float: left;

padding: 20px 5px 1px 1px;

}

.col1 select {

    width: 95%;

}

td.col1:before { content: "Employment";width:19%; }

td.col2:before { content: "Employee"; width:19%;}

td.col3:before { content: "Position"; width:19%;}

td.col4:before { content: "Period From";width:19%;}

td.col5:before { content: "To"; width:19%;}

td.col1 { width: 30%; }

td.col2 { width: 30%; }

td.col3 { width: 30%; }

td.col4 { width: 35%; }

td.col5 { width: 19%; }

input[type="text"] {

    width: 95% !important;

}

span.dateDrowdowns .d {

    display: none;

}

img.calendarIcon {

    display: none;

}

th { display: none; }

You can also check this sample clone form that I use for testing: https://form.jotform.com/61812126831955. Here is how the field looks like after adding the css code.

Hello Chriistian,

Perfect !  Thanks your instruction ^^

Justin