[Fixed]-Bootstrap dismissable alerts

by

1👍

✅

Your <div> containing the alert has no closing </div> tag, that messes up the form when you dismiss the alert. As for the alert showing up when the form loads – there’s already some content in the alert div (the ‘close’ button) so it is displayed. You have to render it conditionally (only when there are corresponding errors to show):

    <div class="col-md-3 .col-md-offset-3">
        {% if form.title.errors %}
            <div class="alert alert-warning alert-dismissible" role="alert">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <p>{% for error in form.title.errors %} {{ error }} {% endfor %}</p>
            </div>
        {% endif %}
    </div>
👤rafalmp

Leave a comment