Rails'最佳就地'寶石 - Flash成功消息？

Question

我使用就地編輯在Rails應用程序中的best_in_place寶石（https://github.com/bernat/best_in_place）。我的控制器具有行：

format.json { respond_with_bip(@user) } 

寶石產生任何驗證錯誤呼嚕聲的通知，但沒有任何辦法，我也閃了通知的更新成功？我似乎無法在文檔中的任何位置找到此文件，而且使用JSON響應的事實使得整個事情對我來說似乎都很黑。

任何幫助將不勝感激。

Answer 1

因爲您是使用JSON響應，沒有閃光燈的消息。閃爍在HTML頁面上（您可以爲用戶flash[:message] = "Success! Hooray!"），但沒有地方可以顯示JSON請求。

Answer 2

這取決於你在你的控制器在做什麼，但不能你有被更新時觸發顯示通知的事件 - 關於Ajax：成功的例子。

，在重讀你的問題，我不認爲這會幫助你的實際。但爲了以防萬一，請檢查Flash Render Gem。 Here's the info on how to implement的寶石。

Answer 3

$('.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"]); 
}); 

在你的控制器

format.json { render :json => { :message => "Successfully Saved your Model" } } 

Answer 4

我遇到了類似的問題。我所做的就是讓我自己bip.purr.js文件，並刪除best_in_place.purr從我的application.js文件要求：

//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 . 

我的「錯誤」功能OOB是行不通的，所以我改變了這一點。如果它適合你，你應該看看original source。你應該這樣做無論如何使自己的文件，但是這是我的樣子（資產/ Java腳本/ 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(); 
}); 

而且，只是爲了好玩，一些基本的SCSS把事情看不同：

// 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; 
}