Question

I need to repeat a div on click under the initial div that is on the page, ie a div with a class exists with a button within it that when clicked repeats the div directly after the div that is already there, this is in a form so needs to be written to the page and submitted if it exists. JQuery clone wont manage this, does anyone have a solution

Answer 1

What server side language are you using? For example, if the form is being submitted to PHP, you can change your naming strategy as follows…

<div class="repeatable">
    <input type="text" name="userInput[]">
    <button class="repeat">Add Another</button>
</div>

When you clone this repeatable div, when you submit the form, it will cause $_POST[‘userInput’] to be an array of values (one for each repeatable div that was added dynamically).

Different languages handle this is different ways, for example, you don’t need to use the [] syntax in .NET as it will create an array if many keys have the same name.

Without knowing exactly what you want, I have created this example…

http://jsfiddle.net/Sohnee/aTcGx/1/

The result of the POST after you have added several clones is that the post contains the following:

userInput[] = "a"
userInput[] = "b"
userInput[] = "c"