Is there a way to clone form field values in jQuery or javascript?

ran into the same problem, simple solution:

// touch all input values
$('input:text').each(function() {
    $(this).attr('value', $(this).val());
});

var clones = $('input:text').clone();

the trick is that this will change the actual 'value' attribute in the DOM tree, otherwise the data you enter 'on-the-fly' only exists in the DOM 'state'

Stemming from the notes, here's a solution. With the following form:

<form id="old">
    <textarea>Some Value</textarea>
    <input type="text" value="Some Value" />
    <input type="checkbox" value="bob" checked />
    <br />
</form>

<input type="button" value="Clone" id="clone" />

This jQuery works, including the textareas:

$( 'input#clone' ).click(
    function()
    {
      $( 'form#old textarea' ).text( $( 'form#old textarea' ).val() )
      $("form#old").clone().attr( 'id', 'new_form' ).appendTo("body")

    }
)

​Demo: http://jsfiddle.net/Jux3e/

Another easy fix for the textarea values not being cloned is to include the following JavaScript file in your HTML: https://github.com/spencertipping/jquery.fix.clone

It just patches the clone method so you can include the file and then forget it's there. Apparently there is a problem with cloneing select values too and this same file fixes that problem as well.

This file was linked to from: http://bugs.jquery.com/ticket/3016. The bug is 4 years old.