Skip to main content

Flash Messages

This gem progressively enhances Rails' flash feature to make the defaults easy, and allow customization. By default, regular flash messages are translated into their appropriate Bootstrap 4 alert class.

Rails flash key Bootstrap 4 class
:notice :info
:error :danger
:success :success
:alert :warning

If you do nothing else, any flash messages set in your controller will be rendered below the page headline when they are set. You can override this placement if you like.

Message Partials

The partial bootstrap/messages (included by default in application.html.erb as of pmacs-frontend 1.1) will display messages set using the Rails flash messaging.

Some examples of setting a flash message in a controller:

flash[:error] = 'Dammit, Jim!'
flash[:notice] = "I'm a doctor, not an engineer."
flash[:success] = "Now you're an engineer!"
flash[:alert] = 'Dr. Bones is now wearing a red shirt.'

You could also re-use the messages partial elsewhere and specify a custom message:

<%= render 'bootstrap/error', message: 'Dang it, Jim!' %>
<%= render 'bootstrap/notice', message: "I'm just a country doctor." %>
<%= render 'bootstrap/success', message: "You've been promoted to engineer!" %>
<%= render 'bootstrap/alert', message: "I'm going to die, aren't I?" %>

Extended attributes

Ordinarily, flash messages are set as a string value: flash[:notice] = 'Hello, Cleveland!'. If you instead use a Hash as the value, you open up a world of customization possibilities.

flash[:notice] = {
  title: 'A title that appears at the top of the alert',
  message: 'The body of the message, what you normally see with a string value',
  type: 'some-bootstrap-alert-type',
  # All other custom attributes are wrapped in a `props` hash
  props: {
    dismissable: true, # default
    # anything you would add to the alert markup in a normal Rails erb
    alert: {
      class: 'any-class',
      id: 'something-legal',
      data: {
        some_key: 'value'
      }
    }
  }
}

All of these extended attributes are set to sane defaults, so they are all optional.

Use Rails-UJS to show flash messages

Partial re-paints using UJS can be useful for making controller calls and updating only applicable parts of the user's screen. For views that provide feedback to the user, such as a _form partial, controller actions are often associated with corresponding flash messages. The flash message container is, normally, only repainted on a full view request.

To re-render the flash alerts container and show a new flash message with UJS, simply call the following from your view:

// _update.js.erb
$('.alerts').replaceWith('<%= j render partial: "pmacs-frontend/content/alerts" %>');

The corresponding controller action could look something like the following:

# things_controller.rb
def update
  respond_to do |format|
    if @thing.update(thing_params)
      flash[:success] = 'I saved your thing.'
      format.js   { render status: :ok }
      format.html { ... }
    else
      flash[:error] = 'Your thing has errors.'
      format.js   { render layout: false, content_type: 'text/javascript' }
      format.html { ... }
    end
  end
end

You will also have to add a callback to discard the flash object on AJAX calls, like so:

# things_controller.rb
after_action :discard_flash

# ...

def discard_flash
  flash.discard if request.xhr?
end