Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Django bootstrap alerts not working as expected

I need help with this.

I'm trying to make my app looks better with bootstrap alert, I have one alert to add an item and other alert to delete an item.

When I add an item my alert looks great and work fine but when I delete the item it's not working properly.. Only shows my message with no bootstrap alert....

What am I doing wrong?

Here's what I got:

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


    </div>

  </div>
  {% endif %}

Views for my success msg messages.success(request, 'Has been added!.')

Views for my danger msg messages.error(request, 'Has been deleted!.')

Thanks in advance..!

EDIT

I solved my problem as Silvio answered to my question. worked great with every bootstrap alert but the alert-danger to make it work I had to edit my settings.py to something like this:

from django.contrib.messages import constants as message_constants
MESSAGE_TAGS = {message_constants.DEBUG: 'debug',
                message_constants.INFO: 'info',
                message_constants.SUCCESS: 'success',
                message_constants.WARNING: 'warning',
                message_constants.ERROR: 'danger',}
like image 751
User100696 Avatar asked Dec 28 '16 20:12

User100696


2 Answers

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.

like image 102
silviomoreto Avatar answered Nov 12 '22 06:11

silviomoreto


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',
}
like image 17
user3750325 Avatar answered Nov 12 '22 05:11

user3750325