在每个点击页面上添加一个按钮添加到另一个联系表单

Question

我正在创建一个RSVP表单。一个人输入他们的姓名和详细信息进行提交。 但是，此人可能也希望添加其他人。我想要一个按钮，如果需要，他们可以添加另一个人，然后这将创建另一个联系表单。

表格将有单独的膳食选择，这就是为什么新人需要再次使用。是多次重复包含联系表单的DIV，然后以某种方式显示每次点击＆＃34; + 1＆＃34;按钮？

我的代码可以在这里

Answer 1

将表单保留为一个实体，并将联系人作为另一组实体提交。现在页面加载创建表单骨架。

我只是告诉你如何去做它..

<from id="someform" name="someform" action="blah!blah!"></form>

现在在javascript中创建一个联系人创建者函数，

function contactcreator(srno){
  var iDiv = document.createElement('div'); //create the container div
  iDiv.id = srno + 'id';
  var input = document.createElement('input'); // create an input
  input.id = srno + 'inputid';
  input.name = srno + 'inputname';
  iDiv.append(input);
  $("#someform").append(iDiv);  
}

在文档加载时，调用此函数一次，每次用户单击以添加其他联系人时，只需递增计数器srno并使用新的srno再次调用该函数。

通过这种方式，您将拥有一系列连续排列的联系人输入。

完成基础知识后，您可以通过处理想要删除某些联系表单的用户操作来增强UX / UI，等等。