jQuery开发CV生成器动态表单无法删除首个表单问题咨询

功能实现方案 #

1. 给首个表单添加删除按钮 #

在你现有HTML代码中，找到首个带有after-add-more类的control-group容器，在容器的闭合标签前，插入和复制模板一致的删除按钮代码：

<div class="input-group-btn">
  <button class="btn btn-danger remove" type="button"><span class="button ripple-effect" style="background-color: #B31C1C;">Ukloni</span></button>
</div>

插入后首个表单就会显示红色删除按钮，且你的现有删除事件绑定逻辑可以直接复用，不需要额外调整。 #

2. 修复已知代码问题 #

• 修正JS语法错误：你当前的JS代码末尾多了多余的闭合括号，修正后的完整JS代码如下，还可以按需添加最少保留1条表单的判断，避免全部删除影响CV正常填写：

$(document).ready(function() {
  $(".add-more").click(function(){
    var html = $(".copy").html();
    $(".after-add-more").after(html);
  });
  
  $("body").on("click",".remove",function(){
    if($('.control-group').length > 1) {
      $(this).parents(".control-group").remove();
    }
  });
});

• 修复新增表单提交异常：复制模板.copy下所有input的name属性没有加[]后缀，会导致后端只能收到最后一条新增数据，需要把模板里的name统一改为数组形式，比如name="cv_obrazovanje_institucija"改为name="cv_obrazovanje_institucija[]"，其余字段同步修改即可。

内容的提问来源于stack exchange，提问作者user16234808