使用Javascript動態地將表單添加到Django formset中

Question

我想使用Javascript自動將新表單添加到Django formset中，這樣當用戶單擊「添加」按鈕時，它將運行JavaScript，它將新的表單添加到頁面中。

Answer 1

見我使用的代碼，

<script type="text/javascript"> 
$(document).ready(function(e){ 
$(".add-more a").click(function(e){ 
e.preventDefault(); 
var id_groupmembers_set = $('#id_groupmembers_set-TOTAL_FORMS').val(); 
$(".personal-info-grp ul.user-name").append($('#empty_form').html().replace(/__prefix__/g, id_groupmembers_set)); 
$('#id_groupmembers_set-TOTAL_FORMS').val(parseInt(id_groupmembers_set) + 1); 
}); 

$(".signin-form a.cross-btn").live("click", function(e){ 
e.preventDefault(); 
$(this).parent().parent().remove(); 
}); 
}); 
</script> 

您可以使用表單ID和所有的腳本。

示例形式會是這樣

<div id="empty_form" style="display:none"> 
<li> 
<div class="signin-form clearfix"> 
<div class="clearfix"> 
    <label><span>{% trans 'Name' %}<b>*</b></span>:</label> 
    {{ members_form.empty_form.first_name }}{{ members_form.empty_form.name.errors.as_text }} 
</div> 
<div class="clearfix"> 
    <label><span>{% trans 'Age' %}<b>*</b></span>:</label> 
    {{members_form.empty_form.age}}{{members_form.empty_form.age.errors.as_text}} 
</div> 
<div class="clearfix"> 
    <label><span>{% trans 'Gender' %}<b>*</b></span>:</label> 
    {{members_form.empty_form.gender}}{{members_form.empty_form.gender.errors.as_text}} 
</div> 
<a href="#" class="cross-btn"><img src="/static/assets/images/cross-btn.png" alt="" />  </a> 
</div> 
</li> 
</div> 

利用它;）