Flushing Rails Flash messages to HTTP headers for XHR/AJAX requests; Generic AJAX result notifications

application_controller.rb

class ApplicationController < ActionController::Base

  #...

  after_filter :flash_to_headers

  #...
  
protected
  def flash_to_headers
    return unless request.xhr?
    [:success, :info, :error, :notice].each do |flash_type|
      flash_message = flash[flash_type]
      if flash_message.present?
        flash_header = "X-Flash-#{flash_type.to_s.capitalize}"
        response.headers[flash_header] = flash_message
        flash.discard(flash_type)
      end
    end
  end

  
end  

notification_handler.js.coffee

# Uses jQuery, Underscore.js and Underscore.String

notifier =
 
  defaultErrorMessage: 'An error occurred at the server.'
  errorTypes:
    400:
      title: 'Bad Request'
    401:
      title: 'Access denied'
      message: 'You are not authorized to perform this action.'
    403:
      title: 'Access denied'
      message: 'You have to log in to perform this operation.'
    404:
      title: 'Entry not found'
      message: 'The data you have requested is not found.'
    406:
      title: 'Not Acceptable'
    415:
      title: 'Unsupported Media Type'
    422:
      title: 'Unprocessable Entity'
    500:
      title: 'Internal Server Error'
    503:
      title: 'Service Unavailable'
 
 
 showNotification: (options) -> alert(options.text) #Replace with  your notification function
 
 showAjaxFlashMessages: (jqXHR, ajaxSettings) ->
  hasFlashes = false
  _.each ['success', 'info', 'error', 'notice'], (flashType) =>
    capitalizedType = _.string.capitalize(flashType)
    flashHeader = "X-Flash-" + capitalizedType
    flashMessage = jqXHR.getResponseHeader(flashHeader)
    if flashMessage?
      notifier.showNotification(title: capitalizedType, text: flashMessage, type: flashType)
      hasFlashes = true
  return hasFlashes

  showAjaxSuccess: (jqXHR, ajaxSettings) ->
    return if ajaxSettings.skipNotification is true
    message = 'Data has been successfully saved'
    if ajaxSettings.type is 'POST' and jqXHR.status is 201
      notifier.showNotification(title: 'Created', text: message, type: 'success')
    else if (ajaxSettings.type is 'PUT' or ajaxSettings.type is 'PATCH') and jqXHR.status is 202
      notifier.showNotification(title: 'Saved', text: message, type: 'success')
    else if ajaxSettings.type is 'DELETE' and (jqXHR.status is 200 or jqXHR.status is 0) #TODO Why it's 0?
      notifier.showNotification(title: 'Deleted', text: 'Data has been successfully deleted', type: 'notice')

  showAjaxError: (jqXHR, ajaxSettings, thrownError) ->
    return if jqXHR.responseJSON?.error is 'login_failure'
    title = notifier.errorTypes[jqXHR.status]?.title ? _.string.capitalize(jqXHR.statusText)
    message = notifier.errorTypes[jqXHR.status]?.message ? notifier.defaultErrorMessage
    notifier.showNotification(title: title, text: message, type: 'error')


$(document).ajaxComplete (event, jqXHR, ajaxOptions) ->
  unless notifier.showAjaxFlashMessages(jqXHR, ajaxOptions)
    notifier.showAjaxSuccess(jqXHR, ajaxOptions)

$(document).ajaxError (event, jqXHR, ajaxOptions, thrownError) ->
  notifier.showAjaxError(jqXHR, ajaxOptions, thrownError)