Need to duplicate fields depending on how many events are required

I am trying to create a form where people can list their art workshops. Form is complete but need to know how people can list from 1 to 30 workshops. Is there a way to click something and have a part of a form repeat itself as needed. Will send a screen shot of what I mean.

I'm not sure I understood you completely, you could embed form inside of your form by using iFrame embed, and then with certain conditions to reveal/hide those embedded forms.

Here you can find how to add widget to your form:

https://www.jotform.com/help/252-How-to-Add-a-Widget-to-your-Form

If you could give us more information about the workflow we'llbe glad to assist you!

We'll wait for your response.

Thank you!

In other words, what you see that I sent you is static at this point and only one workshop listing can be added and then the whole form is submitted. If they want to add more than one workshop (different dates, place, etc.), what can I do to allow them to duplicate this form (or piece of form) from Sponsor name to Photo for Workshop and when finished adding workshops (1-30+) they can then submit whole form along with payment.

We appreciate you clarifying the specifics of what you are trying to do above for your form.

Because you are planning on allowing users to have 1-30 possible workshops I think for something of this magnitude it would be much to use something like our configurable list widget.

With this widget you can add one or even several more such as in your case.

You can also configure it how you want it including having it suit your needs with specific fields to allow users to add more in a listed format for multiple items of such.

Please see https://www.jotform.com/help/282-How-to-Set-Up-the-Configurable-List-Widget.

The only other alternative you have aside from this is to create a really super long form and hide what you don't need and allow more at the same time but that would use require a lot more work and literally a ton of conditional logic to reflect it properly.

 

Once that is done, is the data from the form still collectible in an excell or word format?

Yes, the collected form submission data would also show up in your reports or submissions exports.

Have been trying to configure that widget and though I have been a graphics and IT guy for years it isn't working the way the instructions say it should. I added the widget and this is what I get on my form:

That would be the default setting of the configurable list widget, by default all the possible input types are listed (which is what is shown in your screenshot). You should be able to edit it by opening the widget wizard. Here's how:

1. Add the Configurable list widget under the "More Fields".

2. In the widget settings, you need to edit the "Fields Configuration" on what input types you want to display. 

 

3. Now for example, I need to have 3 text boxes and 1 calendar in the configurable list widget, I need to edit the "Field Configuration" to this:

Sponsor Name : text :

Artist Name : text : 

Workshop Title: text : 

Calendar : date : m/d/y : 2000-2015

 

And then remove the ones that I don't need. Below is a screencast on how it looks like:

 

You can see on the screencast that the widget allows you to dynamically add rows or repeat the fields multiple times.

 

To learn more about how to setup this widget, please do check this guide: https://www.jotform.com/help/282-How-to-Set-Up-the-Configurable-List-Widget 

The tricky part is how to format your rows, you can do that by injecting your own custom CSS code. But you'll need to be familiar with CSS for this.

I hope that helps.

Thanks. This was very helpful. Now I need to know how to stack the rows instead of having all the info stretched out and not on the page.

 

For example:

Artist Name:

Workshop Title:

etc.

Instead of the way the widget sorts it.

Artist Name: Workshop Title: Medium: etc., etc. etc.

across one row which in my form goes off the page.

 

Hi,

Unfortunately, the Configurable List widget is rendered as table with each item rendered as a row. The fields cannot be stacked up the way you specified. I would suggest you try our Infinite List widget. It has feature similar with Configurable List widget but you can style it more freely.

Please see demo here.

Thanks for that. Infinite List doesn't fit the bill either.

 

Is there any way to duplicate or cut and paste several fields at a time. One way I can work this form is to just give the respondents several and let them fill out however many they want and then submit.

 

Here is what I would want to duplicate:

Hi,

I am quite not sure what you meant. Do you mean you need to copy a group of fields at a time? You can do so by following the steps below.

Do let us know if you need further assistance.

Thanks.

 

You can actually format the Configurable list widget as you like, this is through CSS.

Here's my sample form based on the current form you have: https://form.jotform.com/61724831026956 

This is now how the widget looks like:

 You can add multiple instances of this block fields by clicking the "+" button.

 

Unfortunately, it is not possible to add a file upload on this widget. You will probably need to enable the "Allow Multiple" option in the file upload option or setup multiple file upload fields elsewhere in the form.

You can clone my form to have a copy of that form in your account and for you to study the CSS code that I created. Here it is for your reference:

/* Force table to not be like tables anymore */

table, thead, tbody, th, td, tr { 

display: block; 

}

 

/* Hide table headers (but not display: none;, for accessibility) */

thead tr { 

position: absolute;

top: -9999px;

left: -9999px;

}

tr { border: 1px solid #ccc; }

td { 

/* Behave  like a "row" */

border: none;

border-bottom: 1px solid #eee; 

position: relative;

}

 

td:before { 

/* Now like a table header */

display: inline-block !important;

 

/* Top/left values mimic padding */

top: 6px !important;

left: 6px !important;

width: 40% !important;  

}

 

/* Label the data */

td:nth-of-type(1):before { content: "Sponsor Name: "; }

td:nth-of-type(2):before { content: "Artist Name: "; }

td:nth-of-type(3):before { content: "Workshop Title: "; }

td:nth-of-type(4):before { content: "Media (Levels)"; }

td:nth-of-type(5):before { content: "City, State & Or Country"; } 

td:nth-of-type(6):before { content: "Workshop Start Date "; }

td:nth-of-type(7):before { content: "Workshop End Date "; }

td:nth-of-type(8):before { content: "Contract Person "; }

td:nth-of-type(9):before { content: "Phone Number"; } 

td:nth-of-type(10):before { content: "E-mail";}

td:nth-of-type(11):before { content: "Web Address"; }

 

 

/*Make the width of the date field 50%*/

.dateContainer {

width: 50% !important;

display: inline-block !important;

}

/*Make the width of the text boxes 70%*/

#list > tbody > tr > td > input[type="text"] {

  width: 70% !important;

}

 

/*Hide the original thead*/

th.col1, th.col2, th.col3, th.col4, th.col5, th.col6, th.col7, th.col8, th.col9, th.col10, th.col11 {

display: none !important;

}

}

 

You can edit my code as you pleased. You can find the CSS code under the Widget settings->Custom CSS tab.

I hope that helps.

 

For the other concern that you have, please refer to this link instead: https://www.jotform.com/answers/865614. It's a different concern on this one so we need to have it separated to avoid confusion and for us to better assist you.

Thank you.