Javascript 用于编辑的复制表单
我有一个表单供用户填写,其中一部分可以使用下面的代码复制Javascript 用于编辑的复制表单,javascript,php,jquery,mysql,Javascript,Php,Jquery,Mysql,我有一个表单供用户填写,其中一部分可以使用下面的代码复制 //define template var template = $('.duplicate-sections .form-section:first').clone(); //define counter var sectionsCount = 1; //add new section $('body').on('click', '.addsection', function() { //increment sec
//define template
var template = $('.duplicate-sections .form-section:first').clone();
//define counter
var sectionsCount = 1;
//add new section
$('body').on('click', '.addsection', function() {
//increment
sectionsCount++;
//loop through each input
var section = template.clone().find(':input').each(function(){
//set id to store the updated section number
var newId = this.id + sectionsCount;
//update for label
$(this).prev().attr('for', newId);
//update id
this.id = newId;
}).end()
//inject new section
.appendTo('.duplicate-sections');
return false;
});
//remove section
$('.duplicate-sections').on('click', '.remove', function() {
//fade out section
$(this).closest('.form-section').fadeOut(300, function(){
$(this).closest('.form-section').empty();
});
return false;
});
添加了HTML代码-
<div class="duplicate-sections">
<div class="form-section">
<?php
foreach ($uid as $key => $value)
{ ?>
<div class="form-group row">
<label for="inputFirstName" class="col-form-label col-sm-3 text-
left text-sm-right">Unit Name</label>
<input style="width:50px;" class="form-control" type="text"
name="uid[]" value="<?php echo $value; ?>">
<div class="col-sm-2">
<input style="width:150px;" class="form-control" type="text" name="name[]"
value="<?php echo $unit[$key]; ?>" required>
</div>
</div>
<div class="form-group row">
<label for="inputFirstName" class="col-form-label col-sm-3 text-left text-
sm-right">Bought?</label>
<div class="col-sm-1">
<?php echo tep_draw_checkbox_field('bought[]', '1',
(array_key_exists($key, $bought) && $bought[$key] == '1')); ?>
</div>
<label for="inputFirstName" class="col-form-label col-sm-1
text-left">Built?</label>
<div class="col-sm-1">
<?php echo tep_draw_checkbox_field('built[]', '1',
(array_key_exists($key, $built) && $built[$key] == '1')); ?>
</div>
<label for="inputFirstName" class="col-form-label col-sm-1 text-
left">Primed?</label>
<div class="col-sm-1">
<?php echo tep_draw_checkbox_field('primed[]', '1',
(array_key_exists($key, $primed) && $primed[$key] == '1')); ?>
</div>
<label for="inputFirstName" class="col-form-label col-sm-1 text-
left">Painted?</label>
<div class="col-sm-1">
<?php echo tep_draw_checkbox_field('painted[]', '1',
(array_key_exists($key, $painted) && $painted[$key] == '1')); ?>
</div>
<label for="inputFirstName" class="col-form-label col-sm-1
text-left">Based?</label>
<div class="col-sm-1">
<?php echo tep_draw_checkbox_field('based[]', '1',
(array_key_exists($key, $based) && $based[$key] == '1')); ?>
</div>
</div>
<?php } ?>
</br>
<label for="inputFirstName" class="col-form-label col-sm-3 text-
left text-sm-right"></label><input class="remove col-sm-9" type="button"
value="Remove Unit"></input>
</div>
</div>
<label for="inputFirstName" class="col-form-label col-sm-3 text-
left text-sm-right"></label><input class="addsection col-sm-9"
type="button" value="Add Unit"></input>
单位名称
听起来您在如何再次向用户显示存储表单方面存在问题,而您当前显示的代码与此无关。是的,我认为您可能是对的,我添加了表单代码。我没有看到您在那里进行任何循环?如果您想为存储数据的多个记录输出表单字段,那么应该有一个循环,不是吗?我已经添加了foreach循环并更新了代码。我现在遇到的问题是,当我添加一个新的节时,它会复制当前的2。当然,它会复制,因为您正在克隆。表单节:first
-但是:first
在这里是没有意义的,因为您只是从这些元素中的一个开始创建。您或者需要为每个部分创建一个,或者实际选择您真正感兴趣的单个.form部分中的第一个元素。