How to duplicate three Dropdown-selection-lists with a button?

Hallo.
First of all I apologize since I have written this question in another 3D.....have mercy!!!

In my CF4 form I need a button to duplicate THREE Dropdown selection lists.

Of course the three Dropdowns duplicates every time that the user click on the button named i.e. "ADD".

My three Dropdown lists are:

First dropdown name and ID : source_1 

First dropdown label: TIPLOGIA:

Second dropdown name and ID: target_1

Second dropdown label: VINO:

Third dropdown name and ID: drop_down_cartoni
Third dropdown label: CARTONI:

FYI the first and second dropdown are created following this FAQ:

http://www.chronoengine.com/faqs/58-cfv4/cfv4-elements-and-html/3927-how-can-i-add-a-simple-double-drop-down-without-ajax-.html

I have worked with this FAQ but without success:

http://www.chronoengine.com/faqs/58-cfv4/cfv4-elements-and-html/2700-how-can-i-have-a-button-to-add-more-form-inputs.html

At the moment my very poor result is here:

http://www.ondesign.eu/viniriccardi/ordini-e-preventivi.html

Any help and suggestion will be very appreciated.

Thank - you!!!!

ettore

Hallo.
I have read this post:
http://www.chronoengine.com/forums/posts/f5/t88107.html

And now I understand that it's better NOT to duplicate the Drop-down lists but to save the results of the first set of selections into the form, then add the next set.

Can you give me the code for the example that you showed in the old post?

Thank-you!

ettore

Hi Ettore,

Duplicating the fields is the easiest part, you just need to clone the fields' parent and inject it after the one in the form using JavaScript code!

The challenge then is to display the dynamically created fields in the email or to store them in the database, both tasks require some preparations.

You can find many examples for the JS code here or on Google.

Regards,
Max