AJAX 和 Rails：发布到控制器失败

Question

我有一个具有简单布尔属性的 Rails 模型。当用户单击视图中的复选框时，我试图在后台更新该属性。我相信我已经正确配置了 AJAX 和控制器/路由器，但是当我按下按钮时，AJAX 帖子的错误功能会触发，而不是成功的功能。

我不确定从哪里开始，我无法从错误中提取任何有用的信息。

config/routes.db

...
post "/task_toggle" => "tasks#toggle", :as => "task_toggle"
...

tasks_controller 确实存在并且有一个方法切换。

这是正文末尾的 javascript。我正在使用 taskNumber 来获取需要切换的模型的 ID，并且我已经确认它确实是正确的。

JavaScript/AJAX

<script type="text/javascript">
    $(document).on("click", ".check-task-btn", function() {

        var taskNumber = $(this).parent().attr("id").substring(4);

        $.ajax({
            url: "/task_toggle",
            type: "post",
            data: {task_id: taskNumber},
            dataType: "JSON",
            success: function() {
               window.alert("it worked");
            },
            error: function() {
                window.alert("no");
            }
        });
    });
</script>

当我按下一个标有check-task-btn 类的复选框时，我得到的消息没有打印出来。

这里是控制器，以防万一这里有什么值得注意的地方。

TasksController

def toggle
    task = Task.find(params[:task_id])
    task.finished = !task.finished
    task.save
    redirect_to root_path
end

有人知道我的 AJAX 失败的原因吗？

谢谢

编辑：所以我刚刚检查了一下，它实际上正在对数据库应用更改，但我仍然收到从错误中打印出来的警报。为什么会这样？

Answer 1

除了@vinodadhikary 的回答，最可能的问题是您的控制器没有正确渲染视图。我想写一个答案，因为我认为你会受益于 Chrome / Firefox 开发者工具部分的“Network”标签

---

Chrome 开发者工具

当您发送 Ajax 调用时，您的系统基本上代表您执行 HTTP 请求（使用 JS）。简单来说，你的浏览器本质上是在加载一个 URL 而不刷新你的页面

大多数人不理解这一点，并认为 AJAX 是一种神秘的技术。现实情况是，您遇到的错误将是 Rails 在后端出现错误的结果。要查看什么错误，您只需要这样做：

• 右键单击并选择“检查元素”
• 在加载的选项卡中，选择“网络”
• 在网络选项卡中，向左向下滚动并找到 Ajax 请求（将在底部显示为红色）
• 点击它并加载“预览”子标签
• 这应该显示请求的 Rails 错误

---

控制器响应

正如@vinodadhikary 所述，控制器的响应可能是问题的原因。原因是因为respond_to标签不存在

respond_to 允许您的控制器操作以不同的方式处理 different mime-types (JS / JSON / HTML)。您目前正在处理您的所有请求，如下所示：

def toggle
    task = Task.find(params[:task_id])
    task.finished = !task.finished
    task.save
    redirect_to root_path
end

这将以相同的方式处理每个请求（重定向到 root_path），但如果您发送 JSON 或 JS 请求，您将更好地以不同方式处理请求，例如@vinodadhikary 的回答：

def toggle
    task = Task.find(params[:task_id])
    task.finished = !task.finished
    task.save
    repsond_to do |format|
       format.html { redirect_to root_path }
       format.json
    end
end 

Answer 2

我相信罪魁祸首是这里的redirect_to root_path。尝试响应您在 ajax 调用中要求 json 格式的不同格式。

试试这个：

  def toggle
    task = Task.find(params[:task_id])
    task.finished = !task.finished

    if task.save
      respond_to do |format|
        format.html { redirect_to root_path }
        format.json 
      end
    else
      # return an error here accordingly
    end
  end