提交按钮在 django 表单中不起作用

Question

I am trying to create a employee using a form. I want that after pressing the submit buttom data saves to employee list table and the page redirect to employee list table also. When I see the error log it shows Method Not Allowed (POST) . I think my code is fine but somehow it is not working.

employee_add_form.html:

{% extends 'base.html' %}
{% block content %}
{% load static %}
<link rel="stylesheet" href="{% static 'employee/css/master.css' %}">

{% load bootstrap4 %}
<div class="">
  <form class="form" action="{% url 'employee:employee-list' %}" method="post" id="employee_add_form">
    {% csrf_token %}

    <!-- {% bootstrap_css %}-->
    {% bootstrap_javascript jquery='full' %}
    {{ form.media }}
    {{ form.non_field_errors }}
    <div class="container">
      <label for=""><b>Personal Info</b></label>
      <div class="border">
        <div class="form-row">
          <div class="col">
            {{ form.first_name.errors }}
            <label for="">First Name</label>
            {{ form.first_name}}
          </div>
          <div class="col">
            {{ form.last_name.errors }}
            <label for="">Last Name</label>
            {{ form.last_name}}
          </div>
          <div class="col">
            {{ form.photo_id.errors }}
            <label for="">Photo ID</label>
            {{ form.photo_id }}
          </div>
        </div>

        <div class="form-row inline">
          <div class="col-4">
            {{ form.gender.errors }}
            <label for="">Gender</label>
            {{ form.gender }}
          </div>
          <div class="col-4">
            {{ form.blood_group.errors }}
            <label for="">Blood Group</label>
            {{ form.blood_group }}
          </div>
          <div class="col-4">
            {{ form.religion.errors }}
            <label for="">Religion</label>
            {{ form.religion }}
          </div>
        </div>

        <div class="form-row">
          <div class="col">
            {{ form.birth_date.errors }}
            <label for="">Date of Birth</label>
            {{ form.birth_date }}
          </div>
        </div>
      </div>
    </div>

    <div class="container">
      <label for=""><b>Contact Info</b></label>
      <div class="border">

        <div class="form-row">
          <div class="col">
            {{ form.email.errors }}
            <label for="">Email</label>
            {{ form.email }}
          </div>
          <div class="col">
            {{ form.phone_number.errors }}
            <label for="">Phone Number</label>
            {{ form.phone_number }}
          </div>
          <div class="col">
            {{ form.address.errors }}
            <label for="">Address</label>
            {{ form.address }}
          </div>
        </div>

      </div>
    </div>

    <div class="container">
      <label for=""><b>Work Info</b></label>
      <div class="border">

        <div class="form-row">
          <div class="col">
            {{ form.e_id.errors }}
            <label for="">Employee ID</label>
            {{ form.e_id }}
          </div>
          <div class="col">
            {{ form.designation.errors }}
            <label for="">Designation</label>
            {{ form.designation }}
          </div>
          <div class="col">
            {{ form.department.errors }}
            <label for="">Department</label>
            {{ form.department }}
          </div>
        </div>

        <div class="form-row">
          <div class="col">
            {{ form.join_date.errors }}
            <label for="">Joining Date</label>
            {{ form.join_date }}
          </div>
        </div>
      </div>
    </div>

    <div class="container">
      <label for=""><b>Attachments</b></label>
      <div class="border">
        <div class="form-group">
          <div class="col">
            {{ form.cv.errors }}
            <label for="">CV</label>
            {{ form.cv }}
          </div>
          <div class="col">
            {{ form.document.errors }}
            <label for="">Documents</label>
            {{ form.document }}
          </div>
          <div class="col">
            {{ form.photo.errors }}
            <label for="">Image</label>
            {{ form.photo }}
          </div>

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

    <div class="container">
      <button type="submit" class="btn btn-primary">Submit</button>
    </div>

  </form>
</div>
{% endblock %}

views.py:

class EmployeeAddView(CreateView):
    """
    Created new employee
    """
    template_name = 'employee/employee_add_form.html'
    form_class = EmployeeAddModelForm
    # queryset = Employee.objects.all()
    model = Employee

    def form_valid(self, form):
        print(form.cleaned_data)
        return super().form_valid(form)

    def post(self, request, *args, **kwargs):
        form = self.form_class(request.POST)

        if form.is_valid():
            form.save()

            return HttpResponseRedirect('employee:employee-list')
        return render(request, self.template_name, {'form': form})

urls.py:

from django.urls import path
from django.urls import reverse
from . views import (
                    EmployeeListView,
                    EmployeeAddView,
                    EmployeeDetailView,
                    EmployeeUpdateView,
                    EmployeeDeleteView,
                    )

app_name = 'employee'

urlpatterns = [
    path('employee-list/', EmployeeListView.as_view(), name='employee-list'),
    path('employee-add/', EmployeeAddView.as_view(), name='employee-add'),
    path('employee-list/<int:id>/', EmployeeDetailView.as_view(), name='employee-detail'),
    path('employee-list/<int:id>/update/', EmployeeUpdateView.as_view(), name='employee-update'),
    path('employee-list/<int:id>/delete/', EmployeeDeleteView.as_view(), name='employee-delete'),
]

forms.py:

from django import forms
from core.models import Employee
from bootstrap_datepicker_plus import DatePickerInput


class EmployeeAddModelForm(forms.ModelForm):
    use_required_attribute = False
    class Meta:

        model = Employee
        fields = [
            'e_id',
            'first_name',
            'last_name',
            'gender',
            'religion',
            'blood_group',
            'birth_date',
            'photo_id',
            'designation',
            #'employee_type',
            'join_date',
            'address',
            'phone_number',
            'email',
            #'supervisor',
            'bank_account_no',
            'department',
            #'salary_type',
            'cv',
            'document',
            'photo',
        ]
        widgets = {

                'birth_date': DatePickerInput(),
                'join_date': DatePickerInput(),
        }

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)

        # Edit label:
        self.fields['e_id'].label = 'Employee ID'
        self.fields['cv'].label = 'CV'

        # Remove help suggestion
        for fieldname in ['e_id',
                        'first_name',
                        'last_name',
                        'gender',
                        'religion',
                        'blood_group',
                        'birth_date',
                        'photo_id',
                        'designation',
                        #'employee_type',
                        'join_date',
                        'address',
                        'phone_number',
                        'email',
                        #supervisor',
                        'bank_account_no',
                        'department',
                        #'salary_type',
                        'cv',
                        'document',
                        'photo']:
            self.fields[fieldname].help_text = None

Answer 1

Your form is POST-ing to wrong URL

  <form class="form" action="{% url 'employee:employee-list' %}" method="post" id="employee_add_form">

instead should be

  <form class="form" action="{% url 'employee:employee-add' %}" method="post" id="employee_add_form">

Answer 2

If you are using class based view than you can do this.

class EmployeeAddView(CreateView):

    template_name = 'employee/employee_add_form.html'
    form_class = EmployeeAddModelForm
    queryset = Employee.objects.all()
    success_url = '/employee-list'

def form_valid(self, form):
    print(form.cleaned_data)
    return super().form_valid(form)

Answer 3

Change method="post" to method="POST" it should work. I had a similar problem with CBV. This worked for me.