引导可关闭警报

Question

我的 django 项目中有一个表单，我想在用户单击提交时显示表单错误（如果有）。这是我的领域之一（在我转向其他领域之前努力做到这一点）

<div class="form-group">
    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="title">Title
    </label>

    <div class="col-md-6 col-sm-6 col-xs-12">
        {{ form.title }}
    </div>
    <div class="col-md-3 .col-md-offset-3">
{#                                        <p class="text-danger">{% for error in form.title.errors %}{{ error }}{% endfor %}</p>#}
        <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.errros %} {{ error }} {% endfor %}</p>
        </div>
</div>

但是我有两个问题：

1. 加载表单时会显示警报，但没有错误消息：

1. 当我解除警报时，表单样式会变得混乱：

我似乎无法理解问题所在。

使用此代码，我能够在没有引导警报的情况下获得错误消息。但是，在更正后让用户关闭警报会很棒：

<div class="form-group">
    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="title">Title
    </label>

    <div class="col-md-6 col-sm-6 col-xs-12">
    {{ form.title }}
    </div>
    <span class="help-block">
        <p class="text-danger">{% for error in form.title.errors %}{{ error }}{% endfor %}</p>
    </span>
</div>

Answer 1

您的包含警报的<div> 没有关闭</div> 标记，当您关闭警报时会弄乱表单。至于表单加载时显示的警报 - 警报 div 中已经有一些内容（“关闭”按钮），因此它会显示出来。您必须有条件地渲染它（仅当有相应的错误要显示时）：

    <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>