首页 文章

Jquery克隆克隆相同而不是新名称

提问于
浏览
0

我目前正在使用cakephp进行开发 . 我没有很多jquery的经验,但在这个任务中,我想使用jquery .clone()函数克隆表单的输入/选择字段 . 我已经完成了剧本,但它并没有像我想的那样奏效 . 即使在谷歌搜索后我真的不知道如何解决这个问题 .

问题是:我有这种类型的输入 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]"

我再次点击了添加按钮:

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

它复制相同的名称,而不是增加 Value . 我真的不知道是什么问题 . 请各位帮助我 .

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

谢谢stackoverflow ..

1 回答

  • 2

    尝试:

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

相关问题