Django UpdateView не загружает формы со стилями

Я создал форму, используя класс UpdateView от Django, однако, когда форма загружается, кажется, что текстовые поля и текстовые области не стилизованы (похоже на стиль form.as_p). Вот пример того, что именно я сделал.

Views.py

class UpdatePostView(UpdateView):
    template_name = 'Post/UpdatePost.html'
    model = Post
    fields = ['Title', 'Body']
    success_url = reverse_lazy('BlogApp:main')
  
    def form_valid(self, form):
        form.instance.Title = form.cleaned_data['Title']
        form.instance.Body = form.cleaned_data['Body']
        form.instance.save()
        
        return super().form_valid(form)

Вот как я загрузил форму в UpdatePost.html:

<form id="UpdatePostForm" method="POST">
    {% csrf_token %}
    <div class="form-group">
        <label for="PostTitle">{{form.Title.label}}</label>
        {{form.Title}}         
    </div>
    
    <div class="form-group">
        <label for="PostBody">{{form.Body.label}}</label>
        {{form.Body}}
    </div>

    <input class="btn btn-primary" type="submit" for="UpdatePostForm" value="Update"> 
    </div>
</form>

Поскольку по умолчанию form.body и form.title отображают html-ввод, вы можете переопределить атрибут class из вашего UpdateView следующим образом :

def get_form(self, *args, **kwargs):
        form = super(UpdatePostView, self).get_form(*args, **kwargs)
        form.fields["Title"].widget.attrs["class"] = "form-group"
        form.fields["Body"].widget.attrs["class"] = "form-group"
        return form

Если вы используете Bootstrap, вы также можете использовать django-crispy-forms (версия для Bootstrap 4 https://github.com/django-crispy-forms/django-crispy-forms, версия для Bootstrap 5 - https://github.com/django-crispy-forms/crispy-bootstrap5). Это полезно для жизни DRY (Не повторяйтесь). И тогда это будет что-то вроде (я использую crispy-forms для Bootstrap 5):

pip install crispy-bootstrap5

INSTALLED_APPS = (
    ...
    "crispy_forms",
    "crispy_bootstrap5",
    ...
)

CRISPY_ALLOWED_TEMPLATE_PACKS = "bootstrap5"

CRISPY_TEMPLATE_PACK = "bootstrap5"
class UpdatePostView(UpdateView):
    template_name = 'Post/UpdatePost.html'
    model = Post
    fields = ['Title', 'Body']
    success_url = reverse_lazy('BlogApp:main')
  
    def form_valid(self, form):
        form.instance.Title = form.cleaned_data['Title']
        form.instance.Body = form.cleaned_data['Body']
        form.instance.save()
        
        return super().form_valid(form)

шаблон

{% extends 'base.html' %}
{% load crispy_forms_tags %}

{% block content %}

<h1 class="text-center">Update Profile</h1>
<br />
        <form method="POST" enctype="multipart/form-data">
          {% csrf_token %} 
          {{form|crispy }}
            <button class="btn btn-outline-primary">
              Update 
            </button>
         </form>
{% endblock content %}
Вернуться на верх