Question

我的表单中有一个删除按钮，如下所示：

%td  
  %button.btn.btn-default{class: "delete-btn", "data-id" =>booking.id} Delete

点击“删除”按钮时，如何编写我的javascript以使其删除表格中的行？

基本上，我如何在application.js文件中修改它

$(".delete-btn").on("click", function(e) {
        var bkId = $(e.target).data("id");
        //line to delete it from my form and the db
    });

以前，我在我的html表单中执行此操作以执行删除

'Delete', booking, :method => :delete, :data => { :confirm => 'Are you sure?' }

有人可以告诉我.js / ajax等价物是怎样的吗？

到目前为止我已经开发了这个代码（它执行但我不断收到我的错误信息）：

$(".delete-btn").on("click", function(e) {
        var bkId = $(e.target).data("id");
        $.ajax("/bookings", {
            data: {
                booking: {
                    id: bkId
                }
            },
            method: "DELETE"

        }).done(function(resp){
            window.location = location.href;
        }).fail(function(resp){
            console.log("Error. Unable to delete");
            alert("Error. Unable to delete this booking");
        })
    });

Answer 1

我发现这很容易实现：

%td= link_to 'Delete', booking, :method => :delete, class: "btn btn-danger"

然而，我正在寻找更复杂的问题，包括修改我的application.js（见上文），以便了解前端和后端之间的通信是如何工作的。

删除表单中的项目并保留到数据库中

1 个答案: