使用引导程序样式化错误消息

Posted

技术标签:

【中文标题】使用引导程序样式化错误消息【英文标题】:Styling error messages with bootstrap 【发布时间】:2017-07-09 05:22:02 【问题描述】:

我正在构建自己的表单以 git 摆脱帮助文本,因为我无法更改 django 中的内置表单以删除帮助文本。

到目前为止一切顺利,但我无法设置错误消息的样式。

它显示了基本的 ul 和 il 样式。

我该怎么做? 谢谢。

<form class="" method="post">
   % csrf_token %
          <label for="id_new_password1"> Senha </label><br>
    <div class="">
        <input required text="password" class="form-control" placeholder="Senha" name="new_password1"/>
             form.new_password1.errors 
    </div><br>
         <label for="id_new_password2"> Confirmar senha </label><br>
    <div class="">

       <input required text="password" class="form-control" placeholder="Confirmar senha" name="new_password2"/>
         form.new_password2.errors 
    </div><br>
    <input type="submit" class="btn btn-primary col-sm-12" value="Confirmar" />

</form>

【问题讨论】:

【参考方案1】:

尝试将错误消息包含在一个元素中。

<div class="error-messages"> form.new_password1.errors </div>

.error-messages 
  color: red;
  font-size: 12px; 

【讨论】:

【参考方案2】:

您可以使用alerts。像这样:

% if form.new_password1.errors %
    <div class="alert alert-danger" role="alert"> form.new_password1.errors </div>
% endif %

另外,您是否尝试过 this answer 试图摆脱 help_text?

【讨论】:

以上是关于使用引导程序样式化错误消息的主要内容,如果未能解决你的问题,请参考以下文章

将 ValidationSummary MVC3 显示为“警报错误”引导程序

样式化 twitter 引导按钮

如何使用引导程序在 MVC5 顶部显示验证错误摘要?

无法在设计登录页面中显示引导样式表

如何使用引导程序设置自定义 joomla 组件的样式

在引导程序中自定义下拉样式?