如何使Ajax複選框回調

Question

大廈關閉「Rails change boolean value with checkbox and jquery ajax」，我試圖建立一個複選框Ajax POST調用。

該調用似乎工作，但沒有辦法附加回調，我可以看到。

在「Working with JavaScript in Rails」，你似乎能夠通過這段代碼做到這一點：

$(document).ready -> 
    $("#new_article").on("ajax:success", (e, data, status, xhr) -> 
     $("#new_article").append xhr.responseText 
    ).on "ajax:error", (e, xhr, status, error) -> 
     $("#new_article").append "<p>ERROR</p>" 

但這似乎並沒有工作。

當我將它附加到複選框類（所以而不是new_article），成功命中後，沒有任何東西被觸發。有什麼想法嗎？我應該把它附加到別的東西嗎？我查看了代碼，在我的複選框周圍沒有生成任何表單。

以下是更多links，似乎支持以前的JavaScript代碼是它應該如何工作，但沒有工作。

Answer 1

如果您使用remote: true，你就可以使用following：

#view 
<%= check_box_tag :param_name, "value", false, id: "check_box", data: { remote: true, url: your_path} %> 

-

remote: true調用rails_ujs，其中有一個系列的event hooks（你使用以上）。你需要綁定你的JS這些事件掛鉤，以獲取你想要的迴應：

#app/assets/javascripts/application.coffee 
$(document).on("ajax:success", "#check_box", (data, status, xhr) -> 
    $("#new_article").append xhr.responseText 
).on "ajax:error", "#check_box", (e, xhr, status, error) -> 
    $("#new_article").append "Error" 

幾件事情需要明白：

1. 如果你有turbolinks啓用，始終delegate從document對象（ JQuery只能綁定到加載了DOM）
2. 的元素如果您試圖「抓住」Ajax響應（在本例中爲remote: true），它需要綁定到元素發送請求。通常情況下，這將是一個形式，但在你的情況下，它的複選框

---

這當然，依賴於你發送通過rails_ujsremote: true助手的請求的想法。相反，如果你想發送一個請求，以「裸」 JQuery的，你想使用：

#view 
<%= form_tag ... do %> 
    <%= check_box_tag :x, "y", id: "check_box" %> 
<% end %> 

#app/assets/javascripts/application.coffee 
$(document).on "change", "#check_box", (e) -> 
    $.ajax 
     url: "your/path/as/a/string", 
     data: $(this).val(), 
     success: (data) -> 
     // do something, 
     error: (data) -> 
     // do something