After destroying the Datatable, next load shows error : Cannot read Property 'column' of Undefined

Asked

Viewed 206 times

0

When loading the datatable for the first time, everything works normally, the table columns are viewed without problem. But when I update the table with a new filter parameter, the table is not loaded, and is showing the message by clicking, and shows the error:

VM26416:1 Uncaught Typeerror: Cannot read Property 'column' of Undefined Responsivedatatableshelper.createExpandIcon (:1:4640) at n.fn.init.rowCallback (Eval at globalEval (jquery.min.js:2), :329:31)

    // Carregamento a tabela na primeira vez
$(document).ready(function() {
        AjaxDatatable();
});




// função da tabela
AjaxDatatable(valorNovoParametro);


// função que cria a tabela
    function AjaxDatatable(Pint_PeriodoAtividades){
        //alert(Pint_PeriodoAtividades);
        var tabelaGrid;
        //$('#dt_basic').DataTable().destroy();
        tabelaGrid = $('#dt_basic').DataTable({ 
            "sDom": "<'dt-toolbar'<'col-xs-12 col-sm-6'f><'col-sm-6 col-xs-12 hidden-xs'l>>" +
            "t"+
            "<'dt-toolbar-footer'<'col-sm-6 col-xs-12 hidden-xs'i><'col-xs-12 col-sm-6'p>r>",  
            "bProcessing": true,
            "bServerSide": true,
            "autoWidth" : true,
            "searching": false,

            "bretrieve": true,
            "bDestroy": true,

            "order":[],
            "lengthMenu": [[10,5,15,20,25,50,100], [10,5,15,20,25,50,100]], 
            "oLanguage": {
                "sProcessing":   '<i class="fa fa-spinner fa-spin fa-3x fa-fw"></i><span>Carregando dados...</span> ',
                "sLengthMenu":   "Mostrar _MENU_ registros",
                "sZeroRecords":  "Não foram encontrados resultados",
                "sInfo":         "Mostrando de _START_ até _END_ de _TOTAL_ registros",
                "sInfoEmpty":    "Mostrando de 0 até 0 de 0 registros",
                "sInfoFiltered": "",
                "sInfoPostFix":  "",
                "sSearch":       "Buscar: ",
                "sUrl":          "",
                "deferRender": true,
                "oPaginate": {
                    "sFirst":    "Primeiro",
                    "sPrevious": "&laquo Anterior",
                    "sNext":     'Seguinte &raquo' ,
                    "sLast":     "Último"
                }
            },
            "ajax": {
                url: "<?php echo $Pstr_UrlControlador.'Pctrl_PreencherTabelaGrid/'?>",
                type:"POST",


                data: function( d ) {
                    d.Pint_IdInteressado= 0;
                    d.Pint_StatusAtividade= 0;
                    d.Pint_TipoAtividade= 2;
                    d.Pint_PeriodoAtividades= 0;
                },

            },
            stateSave: true,

            "columns": [

                { "data": "id" },
                { "data": "status" },
                { "data": "finalizada" },
                { "data": "dtagendamento" },
                { "data": "titulo" },
                { "data": "campanha" },
                { "data": "interessado" },
                { "data": "periodo" },
                { "data": "action" },


            ],

            "columnDefs":[
                { "targets": [0,1,2,7,8], "searchable": false, "orderable": false, "visible": true }  
            ],
            "preDrawCallback" : function() {
                Gjs_MarcarDesmarcarCheckbox(false);
                // Initialize the responsive datatables helper once.
                if (!responsiveHelper_dt_basic) {
                    responsiveHelper_dt_basic = new ResponsiveDatatablesHelper($('#dt_basic'), breakpointDefinition);
                }
            },
            "rowCallback" : function(nRow) {

                responsiveHelper_dt_basic.createExpandIcon(nRow);
            },
            "drawCallback" : function(oSettings) {

                responsiveHelper_dt_basic.respond();
                $('[data-toggle="tooltip"]').tooltip();  // para poder funcionar o tooltip em datatables
            }
        });


    }






 //HTML
    <form action="<? echo $Pstr_UrlControlador.'Gctrl_DeletarRegistroSelecionado' ?>" method="post" name="form_tabela" id="form_tabela">
    <table id="dt_basic" class="table table-striped table-bordered table-hover" width="100%">
    <thead>
    <tr> 
    <th  width="2%"></th>
    <th width="3%">Status</th>
    <th width="3%">Finalizada</th>
    <th width="8%">Data</th>
    <th width="30%">Titulo</th>
    <th width="15%">Campanha</th>
    <th width="15%">Lead</th>
    <th width="8%">Período</th>
    <th width="13%"><i class="fa fa-fw fa-gear" txt-color-blue hidden-md hidden-sm hidden-xs"></i> Ação</th>


    </tr>
    </thead>
    <tbody>
    <tr>
    <td></td> 
    <td></td> 
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    </tr>
    </tbody>
    </table>
    </form>

CARREGAMENTO CORRETO PRIMEIRA INICIALIZACAO CARREGAMENTO COM ERRO APOS CHAMAR O AjaxDatatable(VALORNOVO)

1 answer

0

I solved the problem by removing the code from the script:

"rowCallback" : Function(nRow) { responsiveHelper_dt_basic.createExpandIcon(nRow); },

After deleting that part of the code, it worked!!!!

Browser other questions tagged

You are not signed in. Login or sign up in order to post.