删除表单中的项并将其持久化到数据库中

Delete item in form and persist to the database

本文关键字：持久化 数据库 表单 删除      更新时间：2023-09-26

我的表单中有一个删除按钮，看起来像这样:

%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");
        })
    });

我发现了一个很容易实现的方法:

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

然而，我正在寻找更复杂的一个，包括修改我的application.js(见上文)，以发展我对前端和后端之间的通信如何工作的理解。

相关文章：