Clonage Jquery clonage au lieu du nouveau nom

Question

Je suis actuellement en développement avec cakephp. Je n'avais pas beaucoup d'expérience avec jquery mais dans cette tâche, je veux cloner un champ input/select pour un formulaire en utilisant la fonction jquery .clone(). Je fais déjà le script mais ça n'a pas marché comme je le pensais. Je ne sais vraiment pas comment résoudre ce problème même après avoir fait des recherches sur Google.

le problème est: J'ai ce type d'entrée name="data[item][0][name]", Je veux cloner cette entrée et augmenter la valeur 0 ++ comme ce

 name="data[item][0][name]" 
    name="data[item][1][name]" 
    name="data[item][2][name]" 

qu'ai-je fait est quand je clique sur le bouton Ajouter un attribut , il remplacera et copier même valeur entière comme ceci:

si je clique sur le bouton Ajouter une fois:

name="data[item][1][name]" 
name="data[item][1][name]" 

j'ai cliqué sur le bouton Ajouter à nouveau:

name="data[item][2][name]" 
name="data[item][2][name]" 
name="data[item][2][name]" 

COPIER même nom au lieu d'augmenter le value.I ne sais vraiment pas ce qui est les gars problem.please me aider.

ceci est mon code: PHP:

<div class="form-group"> 
    <div class="col-lg-2" style="padding:none;" > 
            <p style="">Attribute</p> 
             <button type="button" class="btn btn-success" id="addAttribute"><i class="fa fa-plus-circle"></i> Add Attribute</button> 
           </div> 
           <?php $options = $attribute; //fetch some data from db?> 
           <div class="row" style=""> 
          <div class="col-md-9" style="" > 
           <div class="col-lg-3" style="" > 
            <h5 align="center"><u>Attribute Name</u></h5> 
            <div class="form-group"> 
             <div class="col-lg-12"> 

            <?php echo $this->Form->input('attribute.0.attribute_id',array('class'=>'form-control','label'=>false,'id'=>'Attribute','options'=>$options));?> 
            <div id="CloneAttribute"> 

        </div> 
           </div> 
          </div> 
           </div> 

           <div class="col-lg-3" style=""> 
            <h5 align="center"><u>Attribute Value</u></h5> 
            <div class="form-group"> 

             <div class="col-lg-12"> 
            <?php echo $this->Form->input('attribute.0.attribute_value',array('class'=>'form-control','label'=>false,'id'=>'Attribute2',));?> 
           <div id="CloneAttribute2"> 

        </div> 
           </div> 

Jquery

$(document).ready(function(){ 

    index = 0; 
    $("#addAttribute").click(function(){ 
     index++; 
    $("#Attribute").clone().attr("id","Attribute" + index) 
     .appendTo('#CloneAttribute'); 
     //For each input fields contained in the cloned form... 
     $('#CloneAttribute').each(function(){ 
      $('#CloneAttribute select').attr("name",'data[attribute]['+index+'][attribute_id]');      
     }); 
}); 

Merci Stackoverflow ..

Answer 1

Essayez:

$(document).ready(function() { 
    index = 0; 
    $("#addAttribute").click(function() { 
     index++; 
     $("#Attribute").clone() 
     .attr("id", "Attribute" + index) 
     .attr("name", "data[item][" + index + "][name]") 
     .appendTo('#CloneAttribute'); 
    }); 
});