即使更改表页面后如何保存表状态

时间:2020-04-13 08:38:28

标签: javascript jquery datatables

我有一个dataTable,用于显示数据库中的数据。我没有显示为引导模式,并且每行都有一个删除行的选项。

这是从数据库获取数据的jquery:

function cart_contents() {
        $.ajax({
            url: "cartContents.php",
            type: "POST",
            dataType: "JSON",
            success: function(data){
                var table = $('#cart-content').dataTable();
                table.fnDestroy();
                table.dataTable({
                    "aaData": data,
                    "scrollX": false,
                    "lengthChange": false,
                    "ordering": false,
                    "pageLength": 6,
                    "language": {
                        "info": "Number of items: _TOTAL_"
                    },
                    "searching": false,
                    "aoColumns": [
                        {"sTitle": "Product", "mData": "product"},
                        {"sTitle": "Price", "mData": "price"},
                        {"sTitle": "Qty.", "mData": "quantity"},
                        {
                            "sTitle": "Edit", "mData": "id", "render": function (mData, type, row, meta) {
                                return '<button class="btn btn-xs btn-success" onclick="sample(' + mData + ')">Edit</button>';
                            }
                        },
                        {
                            "mData": "id", "render": function (mData, type, row, meta){
                                return "<span style='cursor: pointer' class='close' onclick='remove_product(this," + mData + ")'>x</span>";
                            }
                        }
                    ]
                })
            }
}

这是remove_product:

function remove_product(these, id){
    var i = these.parentNode.parentNode.rowIndex;
    document.getElementById("cart-content").deleteRow(i);
    $.ajax({
        type: "POST",
        url: "remove_product.php",
        data: {product_id: id},
        success: function(data){
            alert(data);
        }
    })
}

现在,由于数据被设置为显示6行,因此该数据可能会或可能不会超过表格中的单个页面。因此,有可能出现分页。每当单击“ x”以删除行时,它都会在页面上将其删除,并成功将其删除到数据库中。

但是,当我滚动到表格的下一页并返回上一步时,被删除的行又回来了。由于它不再存在于数据库中,我将如何永久删除它?我不需要重新加载模态就可以做到这一点。

0 个答案:

没有答案