web-dev-qa-db-ja.com

rails 4-フラッシュ通知

私はまだRails 4デモサイトで作業していますが、奇妙なことがわかります。コントローラーには次のような行があります。

format.html { redirect_to @widget, notice: 'Widget was successfully created.' }

これにより、リダイレクトされたページにフラッシュメッセージが表示されます。ただし、メッセージdivに添付されたcssクラスは、有効なBootstrap alert alert-noticeのようなアラートクラスではなくalert-info]です。

このフラッシュのクラスはどこに設定されていますか?どのようにカスタマイズしますか?

また、ajax経由でレコードを削除する場合、コアフラッシュコンテナにアクセスしてjs経由でメッセージを表示する方法はありますか、またはajaxリクエストのためだけに独自のフラッシュメッセージdivを表示/非表示する必要がありますか?

編集:私のマイケルハートルはlayouts/application.html.erbに触発されました:

<div class="container">
  <% flash.each do |key, value| %>
    <div class="alert alert-<%= key %>"><%= value %></div>
  <% end %>
  <%= yield %>
</div>

ありがとう!

編集2:

おそらく、元の質問では十分に明確ではありませんでした。この場合、クラスがフラッシュオブジェクトにどのように設定されているかを正確に理解しています。 notice:ブロックでformat.htmlを使用およびカスタマイズする方法を学ぶことに興味があります。この通知を介してクラスを渡す方法があるはずです?または、これはコアではありませんRails物事を行う方法?

24
user101289

application.html.erbでは、flashメッセージを表示します。

以下のようにそのコードを更新します

  <% flash.each do |name, msg| %>
    <%= content_tag :div, msg, class: "alert alert-info" %>
  <% end %>

classオプションで、フラッシュメッセージに適用するクラスを追加できます。

[〜#〜] edit [〜#〜]

クラスは、コード内のalert alert-noticeにより、alert alert-<%= key %>としてセットアップされます。 redirect_to @widget, notice: 'Widget was successfully created.を呼び出すとき

フラッシュメッセージがflashハッシュに追加され、キーはnotice、値はWidget was successfully created.になります。つまり、

flash[:notice] = "Widget was successfully created."

編集#2

format.html { redirect_to @widget, notice: 'Widget was successfully created.' }

notice: 'Widget was successfully created.'は、redirect_toメソッドに渡される引数です。このメソッドのflashハッシュに追加されます。

39
Kirti Thorat

これを追加

app/controllers/application_controller.rb

class ApplicationController
  add_flash_types :success, :warning, :danger, :info
end

そして、あなたはあなたのコントローラーでこれを行うことができます

format.html { redirect_to @widget, success: 'Widget was successfully created.' }

レイアウトでこれを行った場合

<div class="container">
  <% flash.each do |key, value| %>
    <div class="alert alert-<%= key %>"><%= value %></div>
  <% end %>
  <%= yield %>
</div>
30
Sachin Mour

@Sachin Mourが示したようにApplicationControllerを台無しにしたくない場合は、それに応じて追加のCSSのクラスをいくつか追加するだけです。

app/assets/stylesheets/custom.scss

/*flash*/
.alert-error {
    background-color: #f2dede;
    border-color: #eed3d7;
    color: #b94a48;
    text-align: left;
 }

.alert-alert {
    background-color: #f2dede;
    border-color: #eed3d7;
    color: #b94a48;
    text-align: left;
 }

.alert-success {
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #468847;
    text-align: left;
 }

.alert-notice {
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #468847;
    text-align: left;
 }

ステップバイステップのチュートリアル、deviseとbootstrapでフラッシュメッセージにアプローチする方法、あなたは見つけることができます here

1
w1t3k