Triggering flash notification upon successful update via AJAX - Ruby on Rails

Question

I want to show the flash success notification upon a successful AJAX update, normally I show the flash notification via the action by,

def something

    redirect_to "that_controller_path", :notice => "Success"

end

But I have no clue as for how to do this in AJAX success call, my AJAX call is,

$.ajax(
      {
      type: "POST",
      url: path,
      data: response1,
      contentType: "application/json",
      success: ->

                 window.location.replace(window.location.protocol + "//" +
                                         window.location.host + "/configuration/manage_users")
                 #Something here!


      });

The flash notification is in my application view as,

<%if flash[:notice]%>
    <div class="flash_notice">
        <%=flash[:notice]%><br>
    </div><!--  close -->
<%end%>

score 0 · Answer 1 · edited May 23 '17 at 12:05

Ajax

First of all, I need to explain that you can't pass standard flash functionality through the "standard" Ajax flow. Reason being that as the flash is set in a session cookie, you will only be able to access these with a browser refresh:

The flash is a special part of the session which is cleared with each request. This means that values stored there will only be available in the next request, which is useful for passing error messages etc.

You need to enure that when you send / receive ajax, in order to set the flash messages, you'll have to cater for them in a different way; either through the ajax call itself, or through another method.

--

Headers

Admittedly, I've never done this before, but looking at this answer suggests you can set the headers in your ajax call:

#app/controllers/your_controller.rb
class YourController < ApplicationController
   after_action :flash_headers

   def flash_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

   private

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

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

I lifted that code from this answer: How do you handle Rail's flash with Ajax requests?

This sets the headers of your request, allowing you to pull this data through your JS:

#app/assets/javascripts/application.js.coffee
$(document).on "click", "a", ->
    $.ajax
      type: "POST",
      url: path,
      data: response1,
      contentType: "application/json",
      success: (data) ->
        msg = request.getResponseHeader('X-Message')
        type = request.getResponseHeader('X-Message-Type')

        alert msg #should alert the flash message

If this works, it will give you the capacity to set & show the flash messages as you wish

score 0 · Answer 2 · answered Jun 16 '17 at 09:04

In my case, I am using gritter for displaying nice notifications.

So in my application.html.erb I have before my yield:

<div id="flash">
  <%= render partial: "shared/notice_banner" %>
</div>

In that partial I have:

<% flash.each do |key, message| %>
  <%= js add_gritter(message, :title => key.titleize, sticky: false, time: 3000, :image => key) %>
<% end %>

In my controller:

flash.now[:notice] = "Movie has been deleted."

respond_to do |format|
  format.html { redirect_to root_path }
  format.js
end

and finally in my method.js.erb:

$("#flash").html('<%= j render partial: "shared/notice_banner" %>')

You can see the whole code here:

https://github.com/cristofer/moviedb

I hope it helps

Cheers

Triggering flash notification upon successful update via AJAX - Ruby on Rails

2 Answers2