В настоящее время я занимаюсь разработкой cakephp. У меня не было большого опыта работы с jquery, но в этой задаче я хочу клонировать поле ввода/выбора для формы, используя функцию jquery.clone(). Я уже делал скрипт, но он не работал, как я думал. Я действительно не знаю, как решить эту проблему даже после googling.
проблема в следующем: у меня есть тип ввода name="data[item][0][name]"
, я хочу клонировать этот вход и увеличивать 0 value++, как это
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]"
он копирует одно и то же имя, а не увеличивает значение. Я действительно не знаю, в чем проблема. Помогите мне помочь.
это мой код: 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..
Пытаться:
$(document).ready(function () {
index = 0;
$("#addAttribute").click(function () {
index++;
$("#Attribute").clone()
.attr("id", "Attribute" + index)
.attr("name", "data[item][" + index + "][name]")
.appendTo('#CloneAttribute');
});
});