2014-04-29 94 views
0

我目前在用cakephp开发。我没有很多jQuery的经验,但在这个任务中,我想使用jquery .clone()函数为表单克隆输入/选择字段。我已经做了脚本,但没有按照我的想法工作。即使用Google搜索后,我也不知道如何解决这个问题。jquery克隆克隆相同而不是新名称

的问题是: 我有这种类型的输入name="data[item][0][name]", 我想克隆这个投入,提高了0值++这样

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

我做了什么是当我点击添加属性按​​钮, 它将取代和复制相同的整数值是这样的:

如果我点击添加按钮一次:

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

我再次点击Add按钮:

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

复制相同的名称,而不是增加value.I真不知道什么是problem.please人帮助我。

这是我的代码: 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]');      
     }); 
}); 

谢谢计算器..

回答

2

尝试:

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

感谢@詹姆斯·达菲。它的工作! :) –