CODEWITHSUNDEEP
ruby-on-rails
user3437721
user3437721

Reputation: 2289

Rails - stacking flash messages

My page is using remote calls to render the content (each time a button is clicked), so there are no postbacks.

I generate a flash notice like this in the controller action:

if @something.save
          format.html { redirect_to some_other_path(@this,@that), notice: t('messages.messages.great_success')}
          format.js { flash[:notice] = t('messages.messages.great_success') }

Now I had an issue where the notice would not go away so I added this JS code:

$('document').ready(function() {
    setTimeout(function()
    {
        $('.alert-info').slideUp();
    }, 5000);
});

But it seems that on my page the user can click the button which can call the controller action multiple times, so I need to be able to "stack" the error messages one of top of each other.

Is there a Rails way to do this?

Upvotes: 0

Views: 448

Answers (2)

Michael L.
Michael L.

Reputation: 272

In this case I would use toastr.js. It manages stacking and diappearing of messages. How to use it with flash messages in rails I explained here.

Upvotes: 1

steve klein
steve klein

Reputation: 2629

Not really an answer, but this is how I am generating Flash-like messages in my JS callback (.js.erb):

<% if @slot.errors.any? %> var build_error = "<div class='alert alert-danger' id='build_error'>"; build_error += "The form contains <%= pluralize(@slot.errors.count, 'error') %>."; build_error += "<ul id='error_explanation'>"; <% @slot.errors.full_messages.each do |msg| %> build_error += "<li><%= j msg %></li>"; <% end %> build_error += "</ul>"; build_error += "</div>"; $(build_error).insertBefore( "#edit_slot_<%= @slot.id %>" ); <% else %> $('#signup-modal-<%= @slot.id %>').modal_success(); <% end %>

This should give you the general idea - just build the message using the same classes you use to display Flash messages and then insert them where you want them in your DOM so that appear as expected.

Hope this helps.

Upvotes: 0

Related Questions