html - 来自 django 中的单个表单模型的多个 html 表单

Question

我需要你的帮助

我正在建立一个学校校长投票统计系统

投票结果保存在投票表中作为
候选人 ID | 投票站ID | 结果|

捕获结果时，html 页面将为每个候选人呈现表单。例如，如果有 3 个候选人，则 html 表单将有 3 个表单：

候选人 1：
结果 _______
候选人 id 1001
pollingstationid 301

候选人 2：
结果 _______
候选人 id 1002
pollingstationid 301

候选人 3：
结果 _______
候选人 id 1003
pollingstationid 301


[提交按钮]

问题：

当我点击提交时，它只保存最后一个表格（即候选人3）

我如何将所有三个条目作为新行输入数据库。

视图.py

class candidatesview(AjaxFormMixin, View):
    form_class = pollsForm
    model = Polls
    template_name = 'app/candidates.html'

    def get(self, request):
        form = self.form_class()
        candidatesls = Candidates.objects.all()
        context = {'title':'polls','form' : form, 'candidates': candidatesls }
        #print(context)
        return render(request, self.template_name, context )

    def post(self, request):

        form = pollsForm(request.POST)
        candidatesls = Candidates.objects.all()

        if form.is_valid():

            print(form.cleaned_data['Result'])
            print(form.cleaned_data['Candidateid'])
            print(form.cleaned_data['PollingstationID'])

            form.save()

            messages.success(request,('Form submitted successfuly'))

        else:
            messages.warning(request,('nah!'))

        print(messages)    
        context = {'title':'polls','form' : form, 'candidates': candidatesls, 'message':messages}
        return render(request, self.template_name, context)

表格.py

class pollsForm(forms.ModelForm):


    class Meta:

        model = Polls
        fields = ['Result', 'Candidateid','PollingstationID']

html (candidates.html)

{% extends "app/base.html" %}
{% load widget_tweaks %}
{% block content %}
<div class="bg-white">
    <div class="row">
        <div class="col-lg-4 col-md-4 col-sm-8">


            {% if messages %}
            {% for message in messages %}
            <div class="alert alert-warning alert-dismissible show" role="alert">
                {{ message }}
                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                    <span aria-hidden="false">&times;</span>
                </button>
            </div>

            {% endfor %}
            {% endif%}
            <div id="alertbox">
            </div>
      <div class="form-group">
        <form class="my-ajax-form" method="POST" action="{% url 'polls' %}">

            {% for hidden in form.hidden_fields %}
            {{ hidden }}
            {% endfor %}

            {#{% for field in form.visible_fields %}#}

                <table class="table">
                    {% for candidates in candidates %}

                    <tr>
                        <td>


                                {% render_field form.Result class="form-control" placeholder=candidates.CandidateName id=forloop.counter %}

                                <input type="number"  class="form-control" id={{ forloop.counter }}  value={{ candidates.CandidateID }}>

                                {% render_field form.PollingstationID type="hidden" class="form-control" id="C1_Pollingstation" %}


                                {% for error in field.errors %}
                                <span class="help-block">{{ error }}</span>
                                {% endfor %}


                        </td>
                        <td>
                            <div class="circle" style="background:{{ candidates.CandidateColor }}">2</div>
                        </td>
                    </tr>
                    {% endfor %}

                </table>




            <div class="pull-right">
                <input type='submit' class='btn btn-next btn-fill btn-success btn-wd' name='Post' value='Post' />

            </div>
        </form>
            </div>
        </div>

        </div>
    </div>

<br /> 
{% endblock content %}

{% block javascript %}
<script>
    $(document).ready(function(){
        var $myForm = $(".my-ajax-form")
        var $myMessage = $("#alertbox")
        $myForm.submit(function(event){
            event.preventDefault()
            var $formData = $(this).serialize()
            var $endpoint = $myForm.attr("data-url") || window.location.href
            console.log($formData) 
            console.log($endpoint)
            $.ajax({
                method: "POST",
                url: $endpoint,
                data: $formData,
                success: handleFormSuccess,
                error: handleFormError,
            })
            function handleFormSuccess(data, textStatus, jqXHR){
                console.log(data)
                console.log(textStatus)
                console.log(jqXHR)
                $myForm[0].reset();
                $myMessage.replaceWith('<div class="alert alert-success  show" role="alert" id="alertbox"> post succcess</div> ');

            }
            function handleFormError(jqXHR, textStatus, errorThrown){
                console.log(jqXHR)
                console.log(textStatus)
                console.log(errorThrown)
                $myMessage.replaceWith('<div class="alert alert-warning  show" role="alert" id="alertbox"> post failure</div> ');

            }

        })

    })

</script>

{% endblock %}

标签： htmldjango