Existe-t-il un moyen de cloner des valeurs de champs de formulaire dans jQuery ou javascript?

Question

jQuery a une fonction clone() qui clone le formulaire actuel sans problème, mais ne conserve aucune des valeurs qui ont été entrées dans le formulaire.

Existe-t-il un moyen de contourner ce problème?

Un exemple de code serait très apprécié.

Answer 1

À partir des notes, voici une solution. Avec la forme suivante:

<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" /> 

Cette jQuery fonctionne, y compris les zones de texte:

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

    } 
) 

Démo: http://jsfiddle.net/Jux3e/

Answer 2

Vous pouvez utiliser ce plugin jQuery.

/** 
* clone element, including the textarea part 
*/ 


$.fn.clone2 = function(val1, val2) { 
    // ret for return value, cur for current jquery object 
    var ret, cur; 
    ret = $(this).clone(val1, val2); 
    cur = $(this); 

    // copy all value of textarea 
    ret.find('textarea').each(function() { 
     var value_baru; 

     // use name attribute as unique id 
     value_baru = sek.find('[name="$name"]'.replace('$name', $(this).attr('name'))) 
         .val(); 

     // set the new value to the textarea 
     $(this).val(value_baru); 
    }); 

    // return val 
    return ret; 
} 

Answer 3

couru dans le même problème, solution simple:

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

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

l'astuce est que cela va changer l'attribut « valeur » réelle dans l'arborescence DOM, sinon les données que vous entrez « sur le -Fly » existe que dans les DOM 'État'

Answer 4

trouvé ce problème et a écrit cette enveloppe:

$.fn.cloneField = function(withDataAndEvents) { 
var clones = []; 
this.each(function(){ 
    var cln = $(this).clone(withDataAndEvents); 
    cln.val($(this).val()); 
    clones.push(cln.get(0)); 
}); 
return jQuery(clones); }; 

Answer 5

si vous avez besoin de dupliquer le champ lui-même, vérifier cette fonction grêles relCopy

Answer 6

Une autre solution facile pour les valeurs textarea pas clonés est d'inclure le fichier JavaScript suivant dans votre code HTML: https://github.com/spencertipping/jquery.fix.clone

Il patches juste la méthode clone Vous pouvez donc inclure le fichier et oublier que c'est là. Apparemment, il y a aussi un problème de clonage des valeurs de sélection et ce même fichier résout également ce problème. Ce fichier a été lié à: http://bugs.jquery.com/ticket/3016. Le bug a 4 ans.

Answer 7

Utilisez ce code pour copier les valeurs textarea

clonedObject.find(textareaObject).val(originalObject.find(textareaObject).val());