Rails flash messages with AJAX requests

README.md

Rails flash messages with AJAX requests

original: http://stackoverflow.com/a/10167659/656428

application.html.slim

#flash-message
  - flash.each do |name, msg|
    = content_tag :div, msg, :id => "flash_#{name}"

application_controller.rb

class ApplicationController < ActionController::Base
  protect_from_forgery

  after_filter :flash_to_headers

  private

    def flash_to_headers
      return unless request.xhr?
      response.headers['X-Message'] = flash_message
      response.headers["X-Message-Type"] = flash_type.to_s

      flash.discard # don't want the flash to appear when you reload page
    end

    def flash_message
      [:error, :warning, :notice].each do |type|
        return flash[type] unless flash[type].blank?
      end
    end

    def flash_type
      [:error, :warning, :notice].each do |type|
        return type unless flash[type].blank?
      end
    end
end

flash_message.js

var show_ajax_message;

show_ajax_message = function(msg, type) {
  $("#flash-message").html("<div id='flash-" + type + "'>" + msg + "</div>");
  return $("#flash-" + type).delay(5000).slideUp('slow');
};

$(document).ajaxComplete(function(event, request) {
  var msg, type;
  msg = request.getResponseHeader("X-Message");
  type = request.getResponseHeader("X-Message-Type");
  return show_ajax_message(msg, type);
});

flash_message.js.coffee

show_ajax_message = (msg, type) ->
  $("#flash-message").html "<div id='flash-#{type}'>#{msg}</div>"
  $("#flash-#{type}").delay(5000).slideUp 'slow'

$(document).ajaxComplete (event, request) ->
  msg = request.getResponseHeader("X-Message")
  type = request.getResponseHeader("X-Message-Type")
  show_ajax_message msg, type #use whatever popup, notification or whatever plugin you want