【问题标题】:How to reload dataTable after deleting records/data?删除记录/数据后如何重新加载数据表?
【发布时间】:2017-03-30 08:35:54
【问题描述】:

我已经生成了记录,每一行都有删除按钮,当我点击删除按钮时,它会从数据库中删除记录。此外,删除后它将重新加载数据表。有什么帮助吗?

数据表:

var table = $('#table').DataTable({

    "processing": true,

     //some settings?
});

jQuery:

$(document).on('click', '[id^="delete-product-"]', function() {

    var id = this.id.split('-').pop();

    $.ajax({
        type: 'post',
        url: 'my_controller/delete_product',
        dataType: 'json',
        data: {id: id},
        success: function(callback)
        {
            //What should I code here, that can't reload entire page, only the table 
            //after deleting records
        },
        error: function(status)
        {
            console.log(status);
        }
    });
});

任何帮助将不胜感激。提前谢谢你

【问题讨论】:

    标签: jquery ajax codeigniter datatables


    【解决方案1】:

    您不必重新加载整个表数据,只需删除已删除的行即可。

    $(document).on('click', '[id^="delete-product-"]', function() {
        var $button = $(this);
        var id = this.id.split('-').pop();
        var table = $('#table_id_selector').DataTable(); // replace with your table id 
        selector
        $.ajax({
            type: 'post',
            url: 'my_controller/delete_product',
            dataType: 'json',
            data: {id: id},
            success: function(callback)
            {
                table.row( $button.parents('tr') ).remove().draw();
            },
            error: function(status)
            {
                console.log(status);
            }
        });
    });
    

    【讨论】:

    • 太棒了。它现在正在工作,非常感谢你,兄弟,
    • 跟进问题兄弟,关于编辑?应该重新加载整个页面?或者你能给我一些想法吗?
    • @MarkyOnyab 很棒。如果您通过在旁边打一个绿色勾号来接受我的回答,将不胜感激。关于编辑,这不仅仅是删除。可以通过用文本框替换每个表格单元格来完成简单的输入框,然后在更新完成后将它们替换回文本。但是复杂的输入类型,如日期选择器、下拉列表、富文本字段,最好不要显示在表格中,您需要单独的页面进行编辑。如果您将来需要一些详细的编辑,我建议单独的页面。但是,如果您需要编辑多条记录的速度,但需要进行微小的更改,那么您需要在表格中进行。
    • 在我回答的开头,点击左侧的空勾使其变为绿色
    猜你喜欢
    • 2021-07-20
    • 2012-12-20
    • 1970-01-01
    • 1970-01-01
    • 2013-09-21
    • 2014-10-11
    • 1970-01-01
    • 1970-01-01
    • 2015-10-10
    相关资源
    最近更新 更多