2015-06-21 83 views
0

我想改進我的應用程序中的AJAX反饋(在我的POST模式中的遠程表單等)之後。Rails AJAX反饋,尤其是在錯誤

我已經有一個顯示加載動畫

$(document).ajaxStart(function(){ 
    $('.loading-feedback').show() 
}) 

$(document).ajaxStop(function(){ 
    $('.loading-feedback').hide() 
}) 

一些很好的反饋,但我知道這是不夠的:當我的AJAX請求觸發Completed 500 Internal Server Error in 1985ms ...以及沒有真正發生的用戶。

例如,我想在我的前端顯示一條警報消息。

我已經有一些代碼,可以例如,通過示出oops, your AJAX request triggered a #{err_code} #{err_description}. Please tell the devs :D

我有以下代碼顯示我在AJAX響應,我想重新用於該用來存儲(一些閃光消息成功地示出了自舉AJAX請求後閃爍(內容/類型的閃爍在我的控制器被定義)

application_controller.rb

after_filter :ajax_flash 
def ajax_flash 
    return unless request.xhr? 

    if type = priority_flash 
    response.headers['X-Message'] = flash[type] 
    response.headers['X-Message-Type'] = type.to_s 

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

相關的JavaScript

$(document).ajaxComplete(function(e, request, opts) { 
    fireFlash(request.getResponseHeader('X-Message'), request.getResponseHeader('X-Message-Type')); 
    # Where fireFlash is a function that displays a bootstrap alert 
}); 

但現在,如果有錯誤,我的控制器操作將直接返回。 是否有可能檢測到這一點,例如填充閃光

flash[:fatal] = "oops, your AJAX request triggered a #{err_code} #{err_description}. Please tell the devs :D" 

這將在在我的前端顯示? (注意,我不知道在哪裏可以找到err_code和err_description)

回答

1

您不需要使用Ajax創建Flash消息。

由於Flash消息在呈現時是非持久性的並從會話中刪除,因此您可以通過修改文檔來創建新的Flash消息。

這是一個最小的閃存實施:

$(document).on('flash', function(e, key, message){ 
    var $flash = $('<li class="alert flash js-created"></li>') 
     .addClass("alert-" + key) 
     .html(message); 

    $(this).find('.flashes').append($flash); 
}); 

Turbolinks將清理出來使用閃光燈,因爲它取代了整個<body>

您可以使用ajaxError而不是ajaxStop添加全局ajax故障處理程序。

var $doc = $(document); 
$doc.ajaxError(function(event, jqxhr, settings, thrownError){ 
    $doc.trigger('flash', ['error', jqxhr.status + thrownError]); 
}); 
+0

儘管在大多數情況下,您應該使用特定的ajax故障處理程序,如@vinayakj的答案 – max

+0

您向我展示的代碼與我在'fireFlash()'函數中使用的代碼幾乎相同,不太複雜。 我的確在尋找'ajaxError',現在我該如何檢索錯誤代碼+錯誤信息? –

+0

好的,我正在尋找的'err_description'是第四個參數'thrownError'。現在我怎樣才能得到error_code? –

0

以這種方式使用它。

$loader.fadeIn(); 

jqXHR = $.ajax({ 
      url: "", 
      type: "POST", 
      data: {}, 
      dataType: "json" 
     }); 

jqXHR.done(function(response) { 

}); 

jqXHR.fail(function(jqXHR, textStatus) { 
     console.log("Request failed: " + textStatus); 
}); 

jqXHR.always(function(jqXHR, textStatus) { 
     $loader.fadeOut(); 
}); 
+0

請修復縮進。 – max

+0

sure..fixed it .. – vinayakj