如何进行 Ajax 复选框回调

How to make an Ajax checkbox callback

本文关键字：回调 复选框 Ajax 何进行      更新时间：2023-09-26

构建"Rails change boolean value with checkbox and jquery ajax"，我试图构建一个复选框Ajax POST调用。

调用似乎有效，但无法附加我可以看到的回调。

在

"在 Rails 中使用 JavaScript"中，您似乎可以通过以下代码来做到这一点：

$(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）时，成功命中后不会触发任何内容。有什么想法吗？我应该把它附加到别的东西上吗？我查看了代码，我的复选框周围没有生成任何表单。

这里有更多链接似乎支持以前的JavaScript代码是它应该工作的方式，但没有工作。

如果您使用的是 remote: true ，则可以使用以下方法：

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

--

remote: true调用 rails_ujs ，它具有一系列事件钩子（您在上面使用）。您需要将 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，请始终从document对象委托（JQuery 只能绑定到加载DOM的元素）
  2. 如果您尝试"捕获"Ajax响应（在本例中来自remote: true），则需要将其绑定到发送请求的元素。通常，这将是一个表单，但在您的情况下，它是复选框

当然，这取决于您通过rails_ujs remote: 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
相关文章：