CODEWITHSUNDEEP
javascripthtmlformsduplicates
PHP Scrub
PHP Scrub

Reputation: 171

Duplicating form using Javascript

I've been trying to find a way to duplicate this form and its input fields for a couple of days. I've tried using code that I've found here but to no avail. How do I duplicate this form?

HTML

<form action="dilemman.php" method="post" class="copy" enctype="multipart/form-data">
    Video: <br>
    <input type="text" rows="1" cols="40" name="video"></textarea>
    <div class="input_fields_wrap">
        <button class="add_field_button">Lägg till fler svar</button>
    </div>
    <a href="#" class="copy" rel=".form">Duplicate form</a>
</form>

Javascript

var removeLink = ' <a class="remove" href="#" onclick="$(this).parent().remove(); return false">remove</a>';
$('a.copy').relCopy({limit: 5, append: removeLink});

Upvotes: 0

Views: 3928

Answers (3)

Kresimir Pendic
Kresimir Pendic

Reputation: 3614

you can use only jquery, do not need to use relCopy..

http://codepen.io/mkdizajn/pen/jWEYeB

var cp = $('form.copy').html();
$('a.copy').on('click', function(){
    $('form.copy').append( cp );
})

hth

Upvotes: 1

George Lee
George Lee

Reputation: 826

A quick look at the relCopy docs says that you have to target your form with the rel attribute in the a element, which you are not.

<form action="dilemman.php" method="post" class="copy"

<a href="#" class="copy" rel=".form">Duplicate form</a>

Change to

<form action="dilemman.php" method="post"class="form"

<a href="#" class="copy" rel=".form">Duplicate form</a>

Upvotes: 0

Nero
Nero

Reputation: 265

Html: 

 <button onclick="myFunction()">Duplicate form</button>

js:

 function myFunction() {
        var elmnt = document.getElementById("formid");
        var cln = elmnt.cloneNode(true);
        document.body.appendChild(cln);
    }

Upvotes: 1

Related Questions