[Fixed]-Django bootstrap alerts not working as expected

12πŸ‘

βœ…

I guess you are using the wrong HTML markup for Bootstrap:

{% if messages %}
  <div class="row">
  <div class="col-sm-6 col-sm-offset-3">
      {% for message in messages %}
      <div class="alert alert-{{ message.tags }}" role="alert">
          <p>{{ message }}</p>
      </div>
      {% endfor %}
    </div>

  </div>
{% endif %}

Note that you were using a <p> tag instead of a <div>. Also maybe you can use the {{ message.tags }} directly.

πŸ‘€silviomoreto

20πŸ‘

As an update to the author’s question, only the tags that are being overridden need to be listed in settings:
https://docs.djangoproject.com/en/4.0/ref/contrib/messages/#message-tags

In this case (Bootstrap looking for "danger", but Django providing "error"):

from django.contrib.messages import constants as messages
MESSAGE_TAGS = {
    messages.ERROR: 'danger',
}
πŸ‘€user3750325

Leave a comment