Проверка CSRF не удалась. Запрос прерван - даже после добавления {% csrf_token %}

Я получаю сообщение CSRF verification failed. Ошибка прерванного запроса. Я провел обширное исследование и все указывало на добавление {% csrf_token %} в тег шаблона с POST формой, и я сделал это, но все равно получаю ту же ошибку.

Вот какие настройки я установил для сайта. """ Настройки Django для проекта LeoneBraidingSite.

Это форма, которую я создал

{% extends 'base.html' %}

{% block contact %}
  <div class="contactProfile">
    <div class="container contact_form">
      <h3 class="title">Contact Us</h3>
      <p>Have questions or concern, please fill out the below inquiry form and a member of our team will contact you for assistance within 24 hours.</p>
      <!--Contact Us Page -->
      <form class="contact_info" action="" method="post" enctype="text/plain" action="index.html">
        {% csrf_token %}

        {% for field in form.visible_fields %}

        <div class="form-group">
          {{ field.errors }}

          <label>{{ field.label_tag }}</label>

          <p>{{ field }}</p>

          {% endfor %}

          <div class="input-group date" id="datetimepicker1" data-target-input="nearest">
            <div class="row align-items-start">
              <div class="col-md-6 date-selector">
                <label for="appt-date">Choose an appointment date: </label>
                <input type="date" class="form-control datetimepicker-input" data-target="#datetimepicker1" />
              </div>
              <div class="col-md-6 time-selector">
                <label for="appt-time">Choose appointment time: </label>
                <div class="time-slots">
                  <div class="row slot-selector">
                    {% for availableHr in availableHrs %}
                    <div class="col morning-appointment">
                      <a class="time-slots" href="{% url 'leonebraiding:booked-timeSlot' availableHr.id %}">{{availableHr.available_Time}}</a>
                      <!-- <a href="#" class="btn btn-outline-dark">{{availableHr.available_Time}}</a> -->
                      <!-- <a class="btn btn-outline-success" href="{% url 'leonebraiding:booked-timeSlot' availableHr.id %}">{{availableHr.available_Time}}</a> -->
                    </div>
                    {% endfor%}
                  </div>
                </div>
              </div>
            </div>

          </div>
          <br>



          <button type="submit" class="btn btn-outline-dark submit-button">Submit</button>
      </form>
    </div>
  </div>
{% endblock %}

Это мое мнение

from django.shortcuts import render, redirect
from django.http import HttpResponse
from django.urls import reverse
from .models import *
from .forms import ContactForm

# HOME PAGE VIEW
def homeView(request):
    carousel_item = FeaturedStyle.objects.all()
    registeredStyle = BraidStyle.objects.all()
    return render(request, 'index.html', {'styles': registeredStyle, 'featured_styles': carousel_item})


#ABOUT US PAGE VIEW
def aboutView(request):
    return render(request, 'about.html', {})


#GALLERY PAGE VIEW
def galleryView(request):
    gallery_post = GalleryPost.objects.all()
    return render(request, 'gallery.html', {'posts': gallery_post})


#APPOINTMENT PAGE VIEW
def pricingView(request):
    registeredPrice = HairstylePrice.objects.all()
    return render(request, 'pricing.html', {'haristyles': registeredPrice})


# CONTACT PAGE VIEW
def contactView(request):
    #available time
    time = AvailableAppointment.objects.all()
    #check for POST requests on load.
    form = ContactForm()

    if request.method == 'POST':
        form = ContactForm(request.POST or None)

        if form.is_valid():
            print("FORM IS VALID")
            print(form.cleaned_data)

    return render(request, 'contact.html', {'form': form, 'availableHrs': time})





def timeSlotView(request, timeSlot_id):
    booked_timeSlot = AvailableAppointment.objects.get(pk=timeSlot_id)
    booked_timeSlot.delete()

    return redirect('leonebraiding:contact')

    return render(request, 'booking.html', {})

Это форма, которую я создал

from django import forms
from datetime import datetime

class ContactForm(forms.Form):
    first_name = forms.CharField(max_length=20)
    last_name = forms.CharField(max_length=20)
    email_address = forms.EmailField(max_length=255)
    telephone_number = forms.CharField(max_length=10)
    message = forms.CharField(widget=forms.Textarea)

@VivekAnand Я воссоздал форму с помощью bootstraps, а затем добавил тег {% csrf_token %} внутрь формы. Теперь она отправляется и посылает уведомление по электронной почте, как и предполагалось. См. ниже:

<form class="contact_info" action="" method="POST">
          {% csrf_token %}
          <div class="row g-3">
            <div class="col-sm-6">
              <label for="first-name">First Name</label>
              <input type="text" name="first-name" class="form-control" aria-label="First name" required>
            </div>
            <div class="col-sm-6">
              <label for="last-name">Last Name</label>
              <input type="text" name="last-name" class="form-control" aria-label="Last name" required>
            </div>
            <div class="col-sm-6">
              <label for="email">Email Address</label>
              <input type="email" name="email" class="form-control" aria-label="Email Address" required>
            </div>
            <div class="col-sm-6">
              <label for="tel">Phone Number</label>
              <input type="tel" name="phone" class="form-control"  id="phone-number" aria-label="Phone Number" required>
            </div>

            <div class="col">
              <label for="tel">Message</label>
              <textarea name="message" rows="4" cols="80" class="form-control" aria-label="Phone Number"></textarea>
            </div>
          </div>
          <br />

          <div class="input-group date" id="datetimepicker1" data-target-input="nearest">
            <div class="row align-items-start">
              <div class="col-md-6 date-selector">
                <label for="appt-date">Choose an appointment date: </label>
                <input type="date" name="date" class="form-control datetimepicker-input" data-target="#datetimepicker1" />
              </div>
              <div class="col-md-6 time-selector">
                <label for="appt-time">Choose appointment time: </label>
                <div class="time-slots" style="">
                  <div class="row slot-selector">
                    {% for availableHr in availableHrs %}
                    <a class="col btn btn-outline-dark" name="booked-time" id="timeSlot" href="{% url 'leonebraiding:booked-timeSlot' availableHr.id %}">{{availableHr.available_Time}}</a>
                    {% endfor%}
                  </div>
                </div>
              </div>
            </div>

          </div>

          <button type="submit" class="btn btn-outline-dark submit-button">Submit</button>
      </form>
Вернуться на верх