web-dev-qa-db-fra.com

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

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

Y a-t-il un moyen de contourner ceci?

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

25
Fred

rencontré 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 consiste à changer l'attribut "valeur" dans l'arborescence DOM, sinon les données que vous entrez "à la volée" n'existent que dans l'état DOM "

26
sled

À partir des notes, voici une solution. Avec le formulaire suivant:

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

Ce jQuery fonctionne, y compris les textareas:

$( '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/

8
hookedonwinter

Une autre solution facile pour les valeurs textarea non clonées consiste à inclure le fichier JavaScript suivant dans votre code HTML: https://github.com/spencertipping/jquery.fix.clone

Cela corrige simplement la méthode de clonage afin que vous puissiez inclure le fichier et ensuite l'oublier. Apparemment, le clonage pose également un problème et ce même fichier corrige également ce problème.

Ce fichier était lié à: http://bugs.jquery.com/ticket/3016 . Le bogue a 4 ans.

4
Ben

si vous avez besoin de dupliquer le champ lui-même, cochez cette fonction métallique relCopy

0
numediaweb

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;
}
0
waza

Utilisez ce code pour copier des valeurs textarea

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

Trouvé ce problème et écrit ce wrapper:

$.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 ); }; 
0
dee32