자바 스크립트를 사용하여 하나의 버튼으로 중복 양식 제출

Question

버튼 클릭으로 복제 할 수있는 양식이 있습니다. 하지만 모든 양식을 한 번에 제출하는 데 문제가 있습니다. 나는 장고와 자바 스크립트를 사용하고있다. 어떻게 해결할 수 있습니까?

{% extends "base.html" %} 
{% load crispy_forms_tags %} 

{% block content %} 
<div id="content" class="span9"> 
    {% if form.errors %} 
    <div class="alert alert-error"> 
     <h4>{{ form.errors }}</h4> 
    </div> 
    {% endif %} 
    <div id = "duplicater" class="span9"> 
     <h1>Add new Profile</h1> 
     <button id="button" class="btn btn-success" onlick="duplicate()">Add more</button> 
    <hr/> 

    <form class="form-horizontal ajax" action="{% url 'create_profile' %}" method="post">{% csrf_token %} 
    {{ form|crispy}} 

     <div class="form-actions"> 
      <a class="btn ajax" data-spinner="off" href="{% url 'home' %}">Cancel</a> 
      <input class="btn btn-primary" type="submit" value="Save"/> 
      <hr/> 
     </div> 
     </form> 
    </div> 
    </div> 

<script type="text/javascript"> 
    document.getElementById('button').onclick = duplicate; 
    var i = 0; 
    var original = document.getElementById('duplicater'); 

    function duplicate() { 
    var clone = original.cloneNode(true); // "deep" clone 
    clone.id = "duplicater" + ++i; // there can only be one element with an ID 
    original.parentNode.appendChild(clone); 
    } 
</script> 
{% endblock %} 

Answer 1

템플릿을 모두 동일한 <form> 요소 안에 넣어야합니다. 이다

는 오히려 전체 양식 duplicater의 이름을 지정하고 복제하는 대신 사업부에 {{ form|crispy }} 변수가 duplicater이라고 포장해야하며, 단일 <form> 요소 내에, 그 끝에 복사본을 추가합니다.