Django: div класса alert alert-danger не работает должным образом

Мой forms.py:

class SignUpForm(forms.ModelForm):
    name = forms.CharField(label="name", required=True, widget=forms.TextInput())

    email = forms.CharField(label="email", required=True, widget=forms.TextInput())

    password = forms.CharField(label="password", widget=forms.PasswordInput(), required=True)

    confirm_password = forms.CharField(label="password", widget=forms.PasswordInput(), required=True)

    def clean(self):
        cleaned_data = super(SignUpForm, self).clean()
        password = cleaned_data.get("password")
        confirm_password = cleaned_data.get("confirm_password")
        if password != confirm_password:
            self.add_error('confirm_password', "Password and confirm password do not match")
        return cleaned_data

    class Meta:
        model = get_user_model()
        fields = ('name', 'email', 'password')

Мой html файл:

{% block content %}
<form method="post">
  <div class="sign-card">
    <h3>Signup</h3>
    {% csrf_token %}
    <div class="input-div">
      <label for="{{ form.name.id_for_label }}">Username:</label>
      {{ form.name }}
    </div>
    <div class="input-div">
      <label for="{{ form.email.id_for_label }}">Email:</label>
      {{ form.email }}
    </div>
    <div class="input-div">
      <label for="{{ form.password.id_for_label }}">Password:</label>
      {{ form.password }}
    </div>
    <div class="input-div">
      <label for="{{ form.password.id_for_label }}">Confirm Password:</label>
      {{ form.confirm_password }}
    </div>
    {% if form.errors %}
       {% for field in form %}
           {% for error in field.errors %}
              <div class="alert alert-danger">
                   <strong>{{ error|escape }}</strong>
              </div>
           {% endfor %}
       {% endfor %}
    {% endif %}

    <button type="submit" class="btn">Sign up</button>
    <p>Already have account? <a href="{% url 'login' %}">Log In</a></p>
  </div>
</form>
{% endblock %}

Мой views.py:

def signup(request):
    if request.method == 'POST':
        form = SignUpForm(request.POST)
        if form.is_valid():
            form.save()
            username = form.cleaned_data.get('name')
            password = form.cleaned_data.get('password')
            email = form.cleaned_data.get('email')
            user = authenticate(username=username, password=password, email=email)
            login(request, user)
            return redirect('index')
    else:
        form = SignUpForm()
    return render(request, 'registration/signup.html', {'form': form})

Проблема, с которой я столкнулся, заключается в том, что <div class="alert alert-danger"> не работает должным образом. Он печатает текст и делает его жирным, но у меня нет CSS-стилей для него (как здесь, например: https://www.csestack.org/display-messages-form-submit-django/). Я не хочу использовать сообщения Django и не хочу менять свой код в views.py. Как я могу это исправить? Если нет способа исправить это без этих изменений, то как я могу исправить проблему, исправляя мои views.py?

Большое спасибо за ваши ответы.

На самом деле, вам не хватает файла css для интерпретации класса alert-danger.

Вы можете либо вручную написать css для него, либо включить какую-нибудь библиотеку css, например bootstrap.

Вы можете сделать что-то вроде следующего в вашем коде: В теге <head>

<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous">
</head>

Тогда все должно работать нормально.

Вернуться на верх