RailsでflashメッセージをBootstrapで表示するスマートな方法

RailsでflashメッセージをBootstrapで表示するスマートな方法です。

add_flash_typesメソッドを使う

add_flash_types – リファレンス – – Railsドキュメント

add_flash_typesメソッドを使うと、flashのキーの指定が自由にできます。

bootstrapの場合は以下４つのキーが指定できます。

<div class="alert alert-success" role="alert">...</div>
<div class="alert alert-info" role="alert">...</div>
<div class="alert alert-warning" role="alert">...</div>
<div class="alert alert-danger" role="alert">...</div>

つまり、rails側でもこのsuccess,info,warning,dangerを使えるようにします。

# application_controller.rb
class ApplicationController < ActionController::Base
add_flash_types :success, :info, :warning, :danger
# Prevent CSRF attacks by raising an exception.
# For APIs, you may want to use :null_session instead.
protect_from_forgery with: :exception
end

add_flash_typesで指定したキーがredirect時のflashで使えるようになります。

通常はnoticeとalertだけかと思いますが、任意のキーを指定できるようになります。

# task_controller.rb
redirect_to tasks_path, success: 'succress create task'

viewで表示方法

<% flash.each do |name, msg| %>
<div class="alert alert-<%= name %>">
<a class="close" data-dismiss="alert">×</a>
<%= msg %>
</div>
<% end %>

これをコピペでいけます。