Question

我正在使用数据表来模拟我的用户数据，并希望在用户点击名为“删除餐厅”的按钮时，从视图中删除时允许删除数据库中的记录。从datatables站点，删除只是隐藏用户的记录，而不是实际删除数据库中的任何内容：https://datatables.net/examples/api/select_single_row.html

如何在locations.js.coffee中调用ajax从数据库中删除选定的表记录记录？

manage.html.erb，用于选择位置然后将其删除的表（在“位置”视图中）：

<%<button id="deleteRestaurant">Delete Restaurant</button> %>
    <table id="restaurantLocations" class="display" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>Store Number</th>
            <th>Address</th>
            <th>City</th>
            <th>State</th>
            <th>Zip Code</th>
        <th>Major City Bidding</th>
            <th>Sit Down?</th>
            <th>Drive Through?</th>
        </tr>
    </thead>
    <tfoot id="input">
        <th>Store Number</th>
        <th>Address</th>
        <th>City</th>
        <th>State</th>
        <th>Zip Code</th>
        <th>Major City Bidding</th>
        <th>Sit Down?</th>
        <th>Drive Through?</th>
      </tr>
    </tfoot>
    <%# current_user.locations.each do |branch| %>
    <tbody>
      <% @restaurant.locations.each do |branch| %>
            <tr>
                <td><%= branch.store_number %></td>
                <td><%= branch.address %></td>
                <td><%= branch.city_name %></td>
                <td><%= branch.state.upcase %></td>
                <td><%= branch.zip %></td>
          <td><%= City.where(id: branch.city_id).pluck(:city).first %></td>
                <td><%= branch.sit_down %></td>
                <td><%= branch.drive_through %></td>
            </tr>
        <% end %>
    </tbody>
    </table>

locations.js.coffee（现在它只是'删除'/隐藏记录）：

table = $("#restaurantLocations").DataTable()

  $("#deleteRestaurant").click ->
    table.row(".selected").remove().draw false
    $.ajax({
      url: "/uploadlocations/",
      type: "post",
      dataType: "json",
      data: {"_method":"delete"}
    });

    return

  return

Answer 1

要删除多行，首先需要确定创建正确的数据库查询所需的特定数据。

以下假设store_number现在就足够了，它将从单元格文本中提取。您可以使用数据表呈现方法进行更多自定义，例如使用data-属性

循环遍历所有selected类并为每个类发出请求，然后删除行

$('#deleteRestaurant').click(function () {
    $('tr.selected').each(function () {
        var $row = $(this);
        var store = $row.find('td:first').text();
        $.post('path/to/server', {store_id: store}, function (response) {
            if ( /* validation of response*/ ) {
                table.row($row).remove();
            }
        });
    });

    table.draw();
});

如果您的后端代码需要更具体的标识符，您可以随时将其放入隐藏列

如何允许使用数据表删除ajax服务器端记录

1 个答案: