php - 使用 Ajax 和 Codeigniter 的 DataTable 问题

Question

在通过单击每列的标题或对其进行搜索进行过滤后，我在加载数据表的内容时遇到了一些问题，表的数据或内容消失了，只有在重新加载页面后才会重新出现。

这是我的 DataTable 初始化和配置：

<script>
$(function () {
    $("#example1").DataTable();
});

//Portugues
$('#example1').DataTable({
    "language": {
        "sProcessing":    "Procesando...",
        "sLengthMenu":    "Mostrar _MENU_ registos",
        "sZeroRecords":   "Não foram encontrados resultados",
        "sEmptyTable":    "Nenhum dado dísponivel nesta tabela",
        "sInfo":          "A mostrar registos de _START_ a _END_ de um total de _TOTAL_ registos",
        "sInfoEmpty":     "Mostrando registos de 0 a 0 de um total de 0 registos",
        "sInfoFiltered":  "(filtrado de um total de registos _MAX_)",
        "sInfoPostFix":   "",
        "sSearch":        "Pesquisar:",
        "sUrl":           "",
        "sInfoThousands":  ",",
        "sLoadingRecords": "A carregar...",
        "oPaginate": {
            "sFirst":    "Primeiro",
            "sLast":    "Último",
            "sNext":    "Seguinte",
            "sPrevious": "Anterior"
        },
        "oAria": {
            "sSortAscending":  ": Ative para ordenar a coluna em ordem ascendente",
            "sSortDescending": ": Ative para ordenar a coluna em ordem decrescente"
        }
    }
});
</script>

这是我的 Ajax 函数，它将数据返回到表中：

$( document ).ready(function() {
        $.ajax({
            type : "POST",
            url  : "<?php echo base_url(); ?>CRUD_Controller/crud_getDataAll/nivel/niveis",
            cache: false,
            contentType: false, 
            processData: false,
            dataType: 'html',
            success: function(data){

                //alert("sucesso - " + data);
                $('#example1 tbody').html(data);

            },
            error:function(xhr)
            {
                alert('Algo falhou, nao caregou a tabela. - ' + xhr.statusText);
            }
        });
    });

这是我的控制器方法案例：

case 'niveis':
            $rows = $this->Administracao_model->getAllData($table_name);
            foreach($rows as $row) {
                echo '<tr>';
                echo '<td class="align-middle text-center"><a href="#">#NIV' . $row->id . '</a></td>';
                echo '<td class="align-middle text-center"><span class="badge ' . $row->classe . '">' . $row->nome . '</span></td>';

                ($row->adicionar == 1) ? $adicionar = "Adicionar" : $adicionar = "";
                ($row->remover == 1) ? $remover = ", Remover" : $remover = "";
                ($row->alterar == 1) ? $alterar = ", Alterar" : $alterar = "";
                ($row->pesquisar == 1) ? $pesquisar = ", Pesquisar" : $pesquisar = "";

                echo '<td class="align-middle text-center">' . $adicionar, $remover, $alterar, $pesquisar . '</td>';

                if($row->id == 1){
                    echo '<td class="align-middle text-center" data-toggle="tooltip" data-placement="top" title="Não é possível remover o nível 0 do sístema."><a href="#" class="btn btn-danger text-white btn-sm disabled" disabled="disabled"><i class="fas fa-trash"></i></a></td>';
                }else{
                    echo '<td class="align-middle text-center"><a href="#" class="btn btn-danger text-white btn-sm" onclick="showModalCerteza(' . $row->id . ')"><i class="fas fa-trash"></i></a></td>';
                }
                echo '</tr>';
            }
            break;

这是我的视图表：

<table id="example1" class="table table-sm table-bordered table-striped Responsive">
                                <thead>
                                    <tr>
                                        <th class="text-center">ID</th>
                                        <th class="text-center">Nome</th>
                                        <th class="text-center">Ações Permissíveis</th>
                                        <th class="text-center">Ação</th>
                                    </tr>
                                </thead>
                                <tbody>
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <th class="text-center">ID</th>
                                        <th class="text-center">Nome</th>
                                        <th class="text-center">Ações Permissíveis</th>
                                        <th class="text-center">Ação</th>
                                    </tr>
                                </tfoot>
                            </table>

提前非常感谢！

标签： phpjqueryajaxcodeigniterdatatables