刷新數據表數據而不重新加載整個頁面

Question

我正在使用 codeigniter 在數據表上加載數據，在數據表上的每一行都有一個鏈接，當單擊數據時，該鏈接將發送到其他地方。 該特定行中的數據應該消失，只保留未被點擊的鏈接。 我已經設法用 AJAX 做到這一點，但成功后我被迫在 jQuery 超時時重新加載頁面

樣本：

//Table headers here
<tbody class="tablebody">
    <?php foreach ($worksheets as $sheets) : ?> 
        <tr>
            <td><?php echo $sheets->filename ?></td>
            <td class="bold assign">
                <?php echo $sheets->nqcl_number ?>&nbsp;&nbsp;&nbsp;
                <?php echo anchor('assign/assing_reviewer/' . $sheets->nqcl_number, 'Assign') ?>
                <a id="inline" href="#data">Assign1</a>
                <input type="hidden" id="labref_no" value="<?php echo $sheets->nqcl_number; ?>" />
            </td>
            <td><?php echo $sheets->uploaded_by ?></td>
            <td><?php echo $sheets->datetime_uploaded ?></td>
            <td></td>                        
        </tr>
    <?php endforeach; ?>
</tbody>

我希望在 AJAX 成功時，鏈接所在的數據表行會從表中動態刪除，而無需刷新頁面。

$.ajax({
    type: "POST",
    url: "<?php echo base_url(); ?>assign/sendSamplesFolder/" + labref,
    data: data1,
    success: function(data) {
        var content = $('.tablebody');
        $('div.success').slideDown('slow').animate({opacity: 1.0}, 2000).slideUp('slow');
        $.fancybox.close();
        //Reload the table data dynamically in the mean time i'm refreshing the page
        setTimeout(function() {
            window.location.href='<?php echo base_url();?>Uploaded_Worksheets';
        }, 3000);
        return true;
    },
    error: function(data) {
        $('div.error').slideDown('slow').animate({opacity: 1.0}, 5000).slideUp('slow');
        $.fancybox.close();
        return false;
    }
});

我試過這個，但它加載了兩個相同的頁面。 有什么工作？

  content.load(url);

Answer 1

您可以使用fnDraw()強制數據表重新查詢數據源。 嘗試這個：

// store a reference to the datatable
var $dataTable = $("#myTable").dataTable({ /* Your settings */ });

// in the AJAX success:
success: function(data) {
    $dataTable.fnDraw();
},

閱讀文檔中的fnDraw條目。

Answer 2

var $dataTable = $("#myTable").dataTable({ /* Your settings */ });

var oSettings = $dataTable.fnSettings();

var page = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength);

$dataTable.fnPageChange(page);