Jquery Delete函数一直尝试从数据表中删除同一对象，即使在关闭并重新打开模态之后

Question

从数据表中删除第一个对象。我收到了成功的删除消息，但是当我尝试从数据表中删除另一个对象时，控制器中出现了空错误，因为它试图再次删除相同的对象，而不是我第二次单击的对象。任何帮助表示赞赏。

控制器

      [HttpPost]
        public ActionResult Delete(int id)
        {
            using (ApplicationDbContext db = new ApplicationDbContext())
            {
                Car car = db.Cars.Where(x => x.Id == id).FirstOrDefault();
                db.Cars.Remove(car); // get null value here
                db.SaveChanges();
                return Json(new { success = true, message = "Deleted Successfully" }, JsonRequestBehavior.AllowGet);
            }
        }   

BS模式

div class="modal fade" id="delete" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Delete?</h5>
                <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <div class="modal-body">Are you sure you would like to delete this record?</div>
            <div class="modal-footer">
                <button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
                <button id="del" class="btn btn-primary" type="button" data-dismiss="modal">Delete</button>

            </div>
        </div>
    </div>
</div>

JQuery

删除功能

function Delete(url, titleText) {
    $('#delete').modal('show');
    $("#del").click(function () {
        $.ajax({
            type: "POST",
            url: url,
            success: function (data) {
                if (data.success) {
                    dataTable.ajax.reload();
                    $.notify(data.message, {
                        globalPosition: "top-center",
                        className: "success"
                    })

                }
            }
        });
        $('#delete').modal('toggle');
        $('#delete').data('modal', null);

    })
    return false;
}

DataTable-调用删除功能

$(document).ready(function () {
    dataTable = $("#carsTable").DataTable({
        "responsive": true,
        'columnDefs': [
            {
                "targets": 7, 
                "className": "text-center",
                "width": "4%"
            }],
        "autoWidth": false,
        "ajax": {
            "url": "/Cars/GetData",
            "type": "GET",
            "datatype": "json"

        },

        "columns": [
            { "data": "LicensePlate"},
            { "data":  "Make"},
            { "data":  "Model"},
            { "data":  "SeatingCapacity"},
            { "data":  "BagCapacity"},
            {
                "data": "HasAutomaticTransmission", "render": AddCheckbox 
            },
            {
                "data": "IsAvailable", "render": AddCheckbox 
            },
            {
                "data": "Id", "render": function (data) {

                    return "<a class='btn btn-primary btn-xs' onclick = \"Edit("+ data +")\" > <i class='fa fa-edit'></i> Edit</a><a class='btn btn-primary btn-xs' onclick = \"Delete('/Cars/Delete/" + data + "', 'Delete Car Confirmation')\" > <i class='fa fa-trash'></i> Delete</a><a class='btn btn-primary btn-xs' onclick = Details('/Cars/Details/" + data + "') > <i class='fa fa-edit'></i> Details</a>"

                }

            }

        ],

        "language": {
            "emptyTable": "No data found, please click the <Add Button </b> to add a new record"
        }


        });

});

Answer 1

在您的控制器上添加此：

[HttpPost]
        public ActionResult Delete(int id)
        {
            using (ApplicationDbContext db = new ApplicationDbContext())
            {
                Car car = db.Cars.Where(x => x.Id == id).FirstOrDefault();
                db.Cars.Remove(car); // get null value here
                db.SaveChanges();
                return Json(new { success = true, message = "Deleted Successfully" }, JsonRequestBehavior.AllowGet);
            }
           return RedirectToAction("action where it starts");
        }   

我相信这将使您在删除后刷新页面

Answer 2

问题出在JQuery delete方法中。

function Delete(url, titleText) {
    console.log(url);
    $('#delete').modal('show');
    $("#del").click(function () {
        $.ajax({
            type: "POST",
            url: url,
            success: function (data) {
                if (data.success) {
                    dataTable.ajax.reload();
                    $.notify(data.message, {
                        globalPosition: "top-center",
                        className: "success"
                    })

                }
            }
        });
        $('#delete').modal('toggle');
        $("#del").off("click");

    })

删除第一个对象后，我必须删除click事件，否则当再次单击以删除第二个对象时，该按钮将显示为已单击状态。>