How To Create A Copy Of A Form With Its Dom Elements

How does one create a copy of a form with all of its form elements so that the copy can be manipulated and the original is left unchanged?

Solution 1:

Using plain javascript cloneNode like this

var dupNode = node.cloneNode(deep);

Example

var p = document.getElementById("para1"),
var p_prime = p.cloneNode(deep); 
//If "deep" is set to true it will clone all the child nodes too,
//If set to false then only the node and not the children

Here is the documentation.

Hope that helps.

Solution 2:

Use the jQuery clone object as such:

var cloned_object = $( ".hello" ).clone().

and to add it to the dom

cloned_object.appendTo( ".goodbye" );

Here is the reference:

http://api.jquery.com/clone/