如何使用Twitter Bootstrap Rails gem定义Flash通知

Question

我试图在控制器中设置闪存通知,但似乎我只能定义:通知.当我尝试定义:errors或flash [:errors]时,我遇到了一堆错误.我目前有这个工作,但所有的消息显然是一个通知类型,而不是错误或警告.我想知道如何设置错误或警告而不是通知.我正在使用rails 3.2和twitter bootstrap rails gem

在application.html.erb中

<%= bootstrap_flash %>

在 manuals_controller.rb

class ManualsController < ApplicationController
  def create
    respond_to do |format|
      format.html { redirect_to root_url, notice:'MyManual was successfully created.' }
    end
  end
end

Answer 1

你正在使用seyhunak的twitter-bootstrap-rails gem中的flash助手.您可以自己设置代码并查看一切是如何工作的,而不是使用帮助程序.

以下是我使用Twitter Boostrap设置Rails Flash消息的方法.

Rails使用:notice和:alert作为flash消息键.Twitter Bootstrap提供了一个基类.alert,其中包含其他类.alert-success和.alert-error(请参阅警报的Bootstrap文档).需要进行一些解析才能获得使用Twitter Bootstrap"alert-success"样式设置样式的Rails"notice"消息.任何其他消息,包括Rails"警报"消息,将使用Twitter Bootstrap"alert-error"样式进行样式设置.

默认情况下,Twitter Bootstrap将绿色背景应用于.alert-success,将红色背景应用于.alert-error.Twitter Bootstrap提供带有蓝色背景的第三类.alert-info.通过一点点黑客攻击,可以创建一个带有自定义名称的Rails flash消息,例如:info,它将与Bootstrap .alert-info类一起显示.但是,坚持使用仅使用"警报"和"通知"的Rails约定是明智的.早期版本的Rails使用"错误",但目前的做法是使用"警报"而不是"错误".

您可以包含直接在应用程序布局文件中显示Flash消息的代码,也可以创建部分代码.这是一个部分的例子.

首先,应用程序布局中的内容:

# app/views/layouts/application.html.erb 
.
.
.
<%= render 'layouts/messages' %>
.
.
.

接下来,包含在应用程序布局中的部分:

# app/views/layouts/_messages.html.erb
# Rails flash messages styled for Bootstrap 3.0
# works with Rails 4.0 or Rails 4.1
<% flash.each do |name, msg| %>
  <% if msg.is_a?(String) %>
    <div class="alert alert-<%= name.to_s == 'notice' ? 'success' : 'danger' %>">
      <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
      <%= content_tag :div, msg, :id => "flash_#{name}" %>
    </div>
  <% end %>
<% end %>

以及在控制器中设置两个不同的Flash消息的示例:

class VisitorsController < ApplicationController

  def new
    flash[:notice] = 'Welcome!'
    flash[:alert] = 'My birthday is soon.'
  end

end

这个例子来自我写的一篇深入的文章:

Twitter Bootstrap和Rails

有关容纳四种不同Flash消息类型(成功,错误,警报,通知)的替代方法,请参阅使用Twitter Bootstrap的Rails Flash消息示例.