Rails 'Best in Place' Gem - Flash success message? - ruby-on-rails

Question

I'm using the best_in_place gem (https://github.com/bernat/best_in_place) for in place editing in a Rails app. My controller has the line:
format.json { respond_with_bip(#user) }
The gem generates purr notifications for any validation error, but is there any way for me to also flash a notice for a successful update? I can't seem to find this anywhere in the documentation, and the fact that bip responds with JSON makes the whole thing seem very black box to me.
Any help would be greatly appreciated.

Answer 1

$('.best_in_place').best_in_place().bind('ajax:success', function(evt, data, status, xhr) {
console.dir(evt);
console.dir(data);
console.dir(status);
console.dir(xhr);
// Use them how ever you need eg $("#yourdiv").text(data["message"]);
});
In your controller
format.json { render :json => { :message => "Successfully Saved your Model" } }

Answer 2

It depends on what you are doing in your controller, but couldn't you have an event that gets triggered upon update to display a notice - on ajax:success for example.
Upon re-reading your question, I don't think this'll help you actually. But check out Flash Render Gem just in case.
Here's the info on how to implement the gem.

Answer 3

I ran into a similar issue. What I did was make my own bip.purr.js file and removed the best_in_place.purr require from my application.js file:
//application.js
//= require jquery
//= require best_in_place
//= require jquery_ujs
//= require best_in_place.jquery-ui
//= require jquery.purr
//REMOVED / COMMENTED OUT THE NEXT LINE:
// require best_in_place.purr
// ADDED THIS LINE:
//= require bip.purr
//= require turbolinks
//= require bootstrap-sprockets
//= require_tree .
My 'error' function OOB was not working, so I changed that as well. If it works for you, you should look at the original source. You should do that anyway before making your own file, but this is what mine looks like (assets/javascripts/bp.purr.js):
/*
* BestInPlace 3.0.0.alpha (2014)
*
* Depends:
* best_in_place.js
* jquery.purr.js
*/
/*global BestInPlaceEditor */
BestInPlaceEditor.defaults.purrErrorContainer = "<span class='bip-flash-error'></span>";
BestInPlaceEditor.defaults.purrSuccessContainer = "<span class='bip-flash-success'></span>";
//edited this binding to stop showing 'Error Object object'
jQuery(document).on('best_in_place:error', function (event, request, error) {
'use strict';
// Display all error messages from server side validation
var errors_string = "";
jQuery.each(jQuery.parseJSON(request.responseText), function (index, value) {
if (typeof value === "object") {
$.each(value, function (i, v) {
errors_string += i[0].toUpperCase() + i.slice(1) + " " + v + ". ";
});
} else {
errors_string = value;
}
var container = jQuery(BestInPlaceEditor.defaults.purrErrorContainer).html(errors_string);
container.purr();
});
});
//added this binding for success messages:
jQuery(document).on('best_in_place:success', function (event, request, error) {
'use strict';
// Display all success messages from server side validation
var msg = "Updated Successfully";
var container = jQuery(BestInPlaceEditor.defaults.purrSuccessContainer).html(msg);
container.purr();
});
And, just for fun, some basic SCSS to get things looking different:
// for best in place / purr styling
.purr {
position: fixed;
top: 60px;
right: 100px;
width: 500px;
padding: 20px;
&.bip-flash-error {
background-color: red;
}
&.bip-flash-success {
background-color: green;
}
border: solid 1px #dadada;
border-radius: 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-webkit-box-shadow: 4px 4px 15px 0px rgba(0, 0, 0, 0.75);
-moz-box-shadow: 4px 4px 15px 0px rgba(0, 0, 0, 0.75);
box-shadow: 4px 4px 15px 0px rgba(0, 0, 0, 0.75);
&:first-letter {
text-transform: uppercase
}
;
font-size: 20px;
color: white;
font-weight: bolder;
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

Answer 4

Since you are responding with JSON, there is no flash message. Flashes are on HTML pages (for which you can user flash[:message] = "Success! Hooray!"), but there is no place from them to display on a JSON request.