Need assistance on customizing the form

Hello I was reading This Article and at the end it says that "The Custom CSS part can look a little too technical - but not to worry - we would love to help - just let us know." So i am seeing i could get help with the custom CSS part. I am building a release form for my record label and i was trying to have a "Add Release" button where when you hit it a new set of release questions will appear so you can add another release.

Hello StephenSnody,

If I understand your question correctly, you want to add a set of form fields in the existing form on click of the "Add Release" button. Is that correct? I do not see any custom css requirement currently.

You may like to take a look at our "Configurable list" widget and see if that fits into your requirement. Alternatively, you can also duplicate form fields and then show/hide them by taking advantage of our "Conditions" feature. 

Hope this helps. Do get back to us if you would like us to create a demo form for you and we will surely help you.

We will wait for your response.

Thank you!

Hello StephenSnody,

Sorry for the confusion. It seems you want to add custom css code in configurable list widget. Please add the desired fields in configuration list widget and we will help you with the custom css code.

Thank you!

I want to mimic the field in the Image above. 

Waiting on a reply to continue my work (:

I cloned your form and added custom styles in it. I have also implemented add "release" conditions that shows another set of fields once the "Add another release?" checkbox field is checked. This is only limited to 3 release, however, you can add more by creating more conditions.

https://form.jotform.com/60268610686965

Feel free to clone this form back if you want http://www.jotform.com/help/28-Cloning-a-Form-from-a-Web-Page.

Instead of the "Add another release" with a check box yes I rather have the release details be shown when you hit the "+" when using "Configurable list" 

I would like to just quickly mention what we had mentioned on Twitter.

The Configurable list would allow you to create as many new fields as you wish, but unfortunately it can not have that specific layout nor the upload field.

With conditions you need to create the set of fields that you will show on your form beforehand, but it will still allow you to add as many as you think would be usually needed.

Now I took a form made by my colleague above and applied the change you have mentioned here and was mentioned on twitter - to have a plus instead of checkbox.

This is the result: https://form.jotform.com/60274773902963

The same can be applied to additional fields, so do let us know if you need any assistance with that.

If you like it, you can clone it to your account by following the steps here: How to Clone an Existing Form from a URL

This is perfect other than the First set of Release Details does not have a "File upload feature" and  move the Calendar under the "Generate Automatically" checked box?. those are the only errors I see. this is perfect for what i need but is it possible to add a "-" button as well judt incase they add too many sets of release details?

I am glad to hear that you like it. :)

First set of Release Details does not have a "File upload feature"

You can add to the form any fields as usually, this would not affect the functionality.

The first set however does have the Artwork upload field, but it is hidden with conditions unless the Release type is Album / Compilation, which is why it is not shown all the time.

move the Calendar under the "Generate Automatically" checked box

The same applies as above. Feel free to move them over, add and anything that you wish, without any fear of the same impacting the behavior.

What is important however is that the set of fields that is shown is being placed between the Form Collapses.

I have made a screencast when adding the upload field and moving the DateTime field down.

The screencast shows for set of fields between Release 2 and Release 3, but this applies to all such sets.

What ever is under the form collapse will be made as a group, in any manner it is laid out. You can see more about this setup here: Show or Hide multiple fields at once using form collapse tool

Now the CSS to turn that + into a minus is quite simple, but if you wanted to have the minus at the bottom, that would not be as easy as other things. This would be possible, but would require a bit more optimization and should be something done after everything else.

This is the CSS:

#input_20_0:checked + label:before, #input_31_0:checked + label:before {
    content: "-";
}

I have added it to the form shared earlier so you can check it now and see if that is what you were after.

This is the link to the same: https://form.jotform.com/60274773902963

I do need to change some of the laws I see, But this is perfect!! (: Is there a way I can add transfer the form?

Great to hear that :)

I have mentioned this on twitter, but I can add more description about each here, so would like to use the opportunity :)

How to Clone an Existing Form from a URL

- Here you can see the steps to clone forms from any website (very likely to require some additional modification, but good starting point) or from us to your account.

How to Transfer or Share Forms and Data with Another Account

- Since you have mentioned that it might be going to a third party account, this would help you with the same.

If you wish to simply transfer the form - without any test submissions, you can do that by applying the steps from the first guide while logged into their account (or giving them the same steps)

If you wish to transfer the form and all submissions that are captured (and not deleted) until then, the guide above will show that you can ask us to do the transfer or transfer it yourself by having them make your account a sub account user of their account, which allows you to simply drag and drop form(s) into their account.

Okay i am looking over my form 1 more time before i clone it. I see the button function is under "Single/EP" Can it be moved to the Album option, as in albums there are multiple tracks. I also see you can only use the "+" function to add i think a maximum of 3 release details. the minimum release required for artists to release a Album from my distributor is (9) is it possible to allow 9 release detail sections to be displayed? these are the last of my errors i think i see :P

I see the button function is under "Single/EP"

This is changed by modifying the conditions. You can set them up so that the correct fields are shown or hidden. This is accomplished by showing form collapse as explained here: Show or Hide multiple fields at once using form collapse tool.

the minimum release required for artists to release a Album from my distributor is (9) is it possible to allow 9 release detail sections to be displayed?

Yes, that is possible and quite easy.

To do that you can apply the steps shown here: How to Position Fields in JotForm and here How to Position Fields in JotForm

- I do not recommend copying the conditions as well.

After this, the same CSS needs to be applied to these new elements (which I did for you).

Once you do you end up with something as such: https://form.jotform.com/60274773902963

As mentioned you can clone it over by following these steps: How to Clone an Existing Form from a URL

is it possible to have at the top of each set of release details have a heading with a number like !.) %Release Title% and when the release title i filled in on the details is would show up next to the release details header number? kinda a nifty request but ti thought worth a shot :P

Hello,

You want to display a heading with release number and title? Yes it is possible to achieve your requirement. 

Please take a look at the following cloned form where I added the title on top of each release:  https://form.jotform.com/60280380072952 

I added a "Text" field in form and set it to display the value of the "Release Title" field. Please check the screenshot below:

Hope this helps.

Do get back to us if you have any questions.

Thank you!