javascript - 如何使用 Ajax 调用在 application.js 中正确执行 jquery 请求

Question

我正在尝试将表行重新定位到另一个 <div>通过复选框，我希望使用 Ajax 调用来完成此操作。但事情对我不起作用。单击后没有任何反应，没有简单的响应。我错过了什么？

我在 application.js 中的 Javascript 代码

$(document).on('ready page:load', function () {
    $('.check').on('change', function(){
    if ($(this).is(':checked')) {
    id = $(this).attr('data-id');
    user_id = $(this).attr('data-user-id');
    complete = true;
    path = '/users/' + user_id + '/tasks/' + id;
    var jqXHR = $.ajax({
                 method: 'put',
                 dataType: "application/json",
                 url: path,
                 data: { task: {complete: complete, id: id}  }
    });

    jqXHR.done(function(data){
         task = $(this).closest("tr");
         $('.complete-tasks').last().after(task);
    })
  };
})
})

查看文件_index.html

<h3>Tasks database</h3>

<table>

  <% @tasks.each do |task| %>
    <tr class='tasks' id="task_<%= task.id %>">

    #Some stuff

  <td>
    <input type="checkbox" class='check' data-id="<%= task.id %>" data-user-id="<%= current_user.id %>" data-complete="<%= task.complete %>" >
  </td>

    </tr>

  <% end %>

</table>

<h3>Completed</h3>

<div class="complete-tasks">
</div>

我指的是我的更新操作tasks_controller.rb

 def update
    @task = Task.find(params[:id])

      respond_to do |format|
     if @task.update(task_params)
      format.json { head :no_content }
     else
      format.html { render action: 'edit' }
      format.json { head :no_content }
     end
   end
  end


 private

    def task_params
     params.require(:task).permit(:title, :due_date, :priority, :complete)
    end

end

rake 路

Answer 1

不要在像done 这样的ajax 回调中使用$(this)。在您的情况下，它将不再引用复选框，而是引用 jqXhr 对象。

有关详细信息，请参阅此问题: $(this) inside of AJAX success not working