Django：Jqueryを使用した動的フォームセットは、最初のformsetインスタンスを保存するだけです

Question

サンプルの次のコードを、その外部キーのインラインformset、サンプルの詳細に設定しました。また、Jquery経由でフォームセットの行を追加できるように、動的な機能を追加しました。私はhttp://stackoverflow.com/questions/501719/dynamically-adding-a-form-to-a-django-formset-with-ajaxからJqueryセクションを得ました。両方の実装を試しましたが、同じ結果が出ているようです。私はこの見解で何か間違ったことをしているのだろうかと思っています。

views.py

def project_detail (request, project_id): 
    project = Project.objects.get(id = project_id) 
    sample_form = SampleForm(request.POST or None, request.FILES or None, instance = project) 
    SampleInlineFormSet = inlineformset_factory(Sample, SampleDetail, form=SampleDetailForm, extra=1, can_delete = False) 
    formset = SampleInlineFormSet(request.POST or None, request.FILES or None, prefix="nested") 
    if request.method == "POST": 

     if 'sampleform' in request.POST: 
      if sample_form.is_valid() and formset.is_valid(): 
       sample_temp = sample_form.save() 
       sample = Sample.objects.get(pk = sample_temp.pk) 
       objects = formset.save(commit=False) 
       for object in objects: 
         object.sample = sample 
         object.save() 

       messages.success(request, "Sucessfully Created New Sample Log") 
       return HttpResponseRedirect(reverse('projstatus:project_detail', args=(project_id,)))   
    context = {'project' : project, "sample_form":sample_form, 'formset' : formset} 
    return render(request, 'projstatus/detail.html', context) 

forms.py

<form method='POST' action='' enctype='multipart/form-data'>{% csrf_token %} 
      {% crispy sample_form %} 

      <div id="form_set"> 
       {{ formset.management_form }} 
       {% for form in formset.forms %} 
        <table class='no_error'> 

         {{ form.as_table }} 
        </table> 
       {% endfor %} 
      </div> 
      <input type="button" value="Add More" id="add_more"> 

      <div id="empty_form" style="display:none"> 
       <table class='no_error'> 
        {{ formset.empty_form.as_table }} 

       </table> 
      </div> 
      <script> 
       $('#add_more').click(function() { 
        var form_idx = $('#id_form-TOTAL_FORMS').val(); 
        $('#form_set').append($('#empty_form').html().replace(/__prefix__/g, form_idx)); 
        $('#id_form-TOTAL_FORMS').val(parseInt(form_idx) + 1); 
       }); 
      </script> 


       <button type='submit' class='save btn btn-default' name = 'sampleform'>Save</button>  

      </form> 

しかし、私は最初のフォームセットのインスタンスがこれまでに保存されているこの問題を持っています。どんなに私が動的に入れても関係はありません。誰かが私を助けてくれますか？

編集：

もう一つのインスタンスを追加するためにjqueryのを使用してフォーム

POSTデータの外観（合計2つのインスタンス）

POSTデータのjQueryを使用していません、余分な= 2を設定する（合計2つのインスタンス）

Answer 1

あなたの問題はあなたのjavasc ript。それはあなたが周りに浮かんでいる別の例からそのスニペットを取ったようです。このため

var form_idx = $('#id_form-TOTAL_FORMS').val();

仕事に、id_form-TOTAL_FORMSのidを持つ要素が必要です。

しかし、あなたのフォームにはおそらくid_nested-TOTAL_FORMSなどのIDの入力があると思います。その結果、私はあなたのjavascriptが実際にFormsetの管理フォームデータを更新しているとは思わない。

このページのHTMLを調べ、この入力のidが何であるかを確認する必要があります。また、JSコードが実際に何をしているのかを確認するには、javascriptコンソールを使用してください。

Answer 2

前の回答と同様に、フィールド値を追加するたびに行数で更新する必要があります（nested-TOTAL_FORMS）。現在存在しないフィールドform-TOTAL_FORMSを更新しています。 #id_nested-TOTAL_FORMS

へ#id_form-TOTAL_FORMSからJSを更新

てみてくださいまた、テンプレート変数としてフィールドIDを取得する方法があるかもしれませんが、それは現時点では私をエスケープします。