使用jqueryajaxrubyonrails更新数据库

我有一个列表项，其名称是我要编辑的。单击my.editActivity按钮时，我使用Jquery更改列表项的名称，效果非常好。我想使用Jquery的Ajax更新数据库中的名称。我觉得问题发生在我的活动_controller.rb或routes.rb中，但不确定

  <ul class="list-group-sortable" id="Activities" >
<h1 align = "center">Activities</h1>

  <!-- List each activity in database -->
  <%  @activities.each do |activity| %>
    <li class="list-group-item" id="item" style="list-style: none;">

      <label class="my_label"><%= activity.a_name %></label>

      <!-- Edit activity -->
     <!-- link_to 'edit activity', edit_activity_path(activity) do %>-->
          <button class="editActivity" style="border:none; padding:0; background-color: transparent">
            <i class="fa fa-pencil fa-fw" aria-hidden="true" title="Edit" id="editActivity"></i>
          </button>
     <!-- end %>-->

    </li> <!-- End of list item -->
    <% end %> <!-- End of if statement -->
  <% end %> <!-- End of activity loop -->

结束

这在my routes.rb中：

put '/activities/:id' => 'activities#update'

---

您的代码在

ajax

调用中缺少

headers

属性：

$.ajax({
  headers: {
    'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
  },
  method: 'PUT',
  url: '/activities/' + id,
  data: { a_name: text }
});

$.ajax({
  headers: {
    'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
  },
  method: 'PUT',
  url: '/activities/' + id,
  data: { a_name: text },
  success: function(response) {
    // update item name here
  }
});

---

您还需要为要渲染的

update

操作创建一个

update.js.erb

文件

更新

我还建议首先更新数据库，然后（如果更新成功）更改页面上项目的名称，只需将

success

属性添加到

ajax

调用：

$.ajax({
  headers: {
    'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
  },
  method: 'PUT',
  url: '/activities/' + id,
  data: { a_name: text }
});

$.ajax({
  headers: {
    'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
  },
  method: 'PUT',
  url: '/activities/' + id,
  data: { a_name: text },
  success: function(response) {
    // update item name here
  }
});

---

response

包含您放在

update.js.erb

文件上的任何内容。

update.js.erb

文件包含成功调用

ajax

后将呈现的javascript内容（类似于

update.html.erb

，但对于javascript）。内容取决于执行

ajax

后要执行的操作。