【Django】追加ボタンで生成したformがformsetに追加されない

Question

前提・実現したいこと

Djangoのformsetを動的に追加したい

[１] Choiceモデルをformsetで最低2つ、最高5つまで追加できるようにしています。
[２] view.py内で、作成したChoiceモデルをQuestionモデルに紐づけています。
[３] JavaScriptでformの追加ボタン、削除ボタンを設置しています。

できていること

・追加・削除ボタンは正しく動作し、それぞれのformのidも正しく設定されています。
・min_numで設定した最初の2つのChoiceモデルは正しく追加されます

発生している問題

35つ目までのChoiceモデルがQuestionに追加されない。
どうやら35つ目までの各formがformsetそのものに追加されていないらしい。

ということで、追加ボタンで作成したformをformsetに追加するにはどうしたらいいですか？

該当のソースコード

"""model.py"""
class Question(models.Model):
    #省略

class Choice(models.Model):
    number = models.IntegerField(validators=[MinValueValidator(0), MaxValueValidator(5)], default=0)
    question = models.ForeignKey(Question, on_delete=models.CASCADE)
    choice_text = models.CharField("選択肢", max_length=100)
    votes = models.IntegerField(default=0)

    def __str__(self):
        return self.choice_text

"""form.py"""
class QuestionForm(forms.ModelForm):
    #省略

class ChoiceForm(forms.ModelForm):
    class Meta:
        model = Choice
        fields = ("choice_text",)
        widgets = {
            "choice_text" : forms.Textarea(attrs={"cols": 10, "rows": 2, "placeholder": "100字まで"}),
        }
        labels = {
            "choice_text": ""
        }

ChoiceFormSet = forms.formset_factory(ChoiceForm, extra=0, min_num=2, max_num=5)

"""view.py"""
def question_create(request):
    form = QuestionForm(request.POST)
    formset = ChoiceFormSet(request.POST)
        if form.is_valid() and formset.is_valid():
            question = form.save(commit=False)

            num = 0
            for field in formset:
                question.choice_set.create(
                    number=num,
                    choice_text=field.cleaned_data["choice_text"],
                    votes=0
                )
                num += 1
            question.save()
            return redirect("polls:create_complete", pk=question.id)

    else:
        form = QuestionForm()
        formset = ChoiceFormSet()

　　question.save()

    return redirect("polls:create_complete", pk=question.id)

{% block content %}
<form action="" method="POST">
        <div class="form-group row">
            <div class="col-sm-6">
                {{ form|crispy }}
                {{ form.error }}
            </div>
            <div class="col-sm-6">
                <label>選択肢*</label>
                <div id="choice-area">
                    {{ formset.management_form }}
                    {% for form2 in formset %}
                    <div id="choice-form-{{ forloop.counter0 }}">
                        {{ form2|crispy }}
                    </div>
                    {% endfor %}
                </div>
                <button id="add" type="button" class="btn btn-outline-success">選択肢を追加</button>
                <button id="remove" type="button" class="btn btn-outline-secondary">選択肢を削除</button>
        {% csrf_token %}
    </form>
{% endblock %}

{% block js %}
<script type="text/html" id="choiceCreate-template">
    <div id="choice-form-__prefix__">
        {{ form2|crispy }}
    </div>
</script>

<script>
$(function(){
    var totalManageElement = $('#id_form-TOTAL_FORMS');
    var currentChoiceCount = parseInt(totalManageElement.val());
    var tmpMarkup = $('#choiceCreate-template').html();
    currentChoiceCount -= 1;

    $('button#add').on('click', function(){
        if ( currentChoiceCount == 4 ) { return; }
        currentChoiceCount += 1;
        var compiledTmp = tmpMarkup.replace(/__prefix__/g, currentChoiceCount);
        $('div#choice-area').append(compiledTmp);
        totalManageElement.attr('value', currentChoiceCount);
    });
    
    $('button#remove').on('click', function(){
        if ( currentChoiceCount == 1 ) { return; }
        $('#choice-form-' + currentChoiceCount).remove();   
        currentChoiceCount -= 1;
        totalManageElement.attr('value', currentChoiceCount);
    });
});
</script>
{% endblock %}

補足情報（FW/ツールのバージョンなど）

Django3.0.4

Answer 1

解決しました。
2つ変更する点があります。
1つ目が、formset.management_formをdiv#choice_areaの外に出すこと。外に出すと、テンプレートで追加したformも追加されました。
2つ目が、scriptタグ内で、totalManageElement.attr('value', currentChoiceCount + 1);とすること。これは、番号を0,1,2…と振っているため、TOTAL_FORMの数自体は最後の要素の添字+1になるからです。