javascript - Rails で Javascript を使用して、Bootbox を使用して警告ダイアログを表示する

Question

私は Rails を初めて使用し、Web サイトへの署名に成功したときに成功メッセージを表示しようとしています。サインインが成功したら、bootbox.js を使用して ruby​​ ハッシュ内に保存されているメッセージを表示しようとしています。表示するコンテンツ。以下のコードは、メッセージを表示する場所を示しています。

<div class="sidebar pull-left">
  <!-- sidebar -->
  <div class="col-xs-6 col-sm-3 sidebar-offcanvas" id="sidebar" role="navigation">
    <div class="list-group">
      <span class="fa-stack fa-lg">
      <i class="fa fa-square-o fa-stack-2x"></i>
      <%= link_to '', root_path, class: "fa fa-home fa-fw fa-stack-1x" %>
      </span>
      <span class="fa-stack fa-lg">
      <i class="fa fa-square-o fa-stack-2x"></i>
      <%= link_to '', help_path, class: "fa fa-question fa-fw fa-stack-1x" %>
      </span>  
    </div>
  </div>
</div>
<div class="main-content">
  <%= content_tag :div, class: "flash_messages", data: {flash: flash} do %>
  <% end %>

  <% content_for :alert do %>
    <script type="text/javascript">
      <%= render 'users/show_flash_messages.js' %>
    </script>
  <% end %>

  <% flash.each do |key, value| %>
    <%= yield :alert %>
  <% end %>  
  <%= yield %>
</div>

<%= content_tag :div, class: "flash_messages", data: {flash: flash} do %> <% end %> を使用して、ハッシュ内のデータをクライアントの JavaScript 配列に渡します。ruby ハッシュは、次のコントローラーで初期化されます。

  def create
    @user = User.new(user_params)
    if @user.save
      # sign_in @user 
      flash[:success] = "Welcome!"
      redirect_to @user
    else
      render 'new'
    end
  end

次に、users.js.coffee にメソッドを作成しました。このメソッドは、js 配列から必要な情報を取得して、ブートボックス アラート ダイアログを使用してアラートを表示することを望んでいました。

Messages = flashMessage: (flash) ->
flash_message = flash[1]
bootbox.alert flash_message
return

私はこれを JavaScript で書き、コンバーターを使用してそれを coffeescript に変換しました (これでうまくいくでしょうか?)。次に、flashMessage 関数を呼び出す _show_flash_messages.js.erb という名前の Rails JavaScript ファイルを作成します。

$(function() {
    messages = $('.flash_messages').data('flash');
    Messages.flashMessage(messages);
});

ブートストラップ アラートに情報を表示することはできましたが、これらのブートボックス ダイアログを使用して情報を表示することをお勧めします。私が言ったように、私はRailsを初めて使用し、JavaScriptを適切に統合するのはこれが初めての試みであるため、明らかな何かが欠けている可能性があります。

参考までに、これはダイアログが上に表示されるページの HTML です。

<% provide(:title, @user.name) %>
<div class="center hero-unit">
    <div class="user-profile">
      <span class="user-header">
        <%= gravatar_for @user %>
        <h2>
            <%= @user.name %>
        </h2>
      </span>
      <span id="page-content">
        <p>
            This is where a short biography will go.
        </p>
      </span>
    </div>
</div>