DataTable - Atualizar dados via Ajax

19/08/2021

2

Olá,
Estou com problemas ao tentar atualizar meu DataTable utilizando Ajax.

Quando eu clico em qualquer um dos meus eventos ele monta o Data Table certinho, porém se eu fizer uma nova consulta em qualquer um dos eventos minha Data Table não funciona novamente, ficando apenas o HTML puro. Como resolver isso?

//Função que preenche minha tabela com dados vindo do servidor
layoutColunas = function(obj){
      var layout= "";
       for (var i = 0; i < obj.length; i++) {
           layout+= '<tr class="text-center">';
           layout+= '<td class="nome">'+obj[i].nome+'</td>';
           layout+= '<td class="doc">'+obj[i].doc+'</td>';
           layout+= '<td class="id"><button class="btn-resgatar" value="'+obj[i].id_usuario+'" id_brinde="'+obj[i].id_brinde+'"> Resgatar </button></td>';
           layout+= '</tr>';
       }
       $(".colunas").html(layout);
}
//Função que chama minha Data Table
carregaDataTable = function(){
       $('.dataTable').DataTable({
               "destroy": true;
        });
}


Eu tenho dois eventos que buscam dados no meu servidor:

//Evento que busca informações de acordo com o ID do usuário
$(document).on('submit', 'form',function(event){
        event.preventDefault();
        $.ajax({
            url: "/painel/exibir-brinde/pesquisar",
            method:'get',
            dataType: 'html', 
            data: $( this ).serialize(),
            success: function(result){
                layoutColunas(result);
                carregaDataTable();
            }
        });
    })
//Evento que busca informações de todos os usuários
$(document).on('submit', 'form',function(event){
        event.preventDefault();
        $.ajax({
            url: "/painel/exibir-brinde/todos",
            method:'get',
            dataType: 'html', 
            success: function(result){
                layoutColunas(result);
                carregaDataTable();
            }
        });
    })
Isabela

Isabela

Responder

Posts

19/08/2021

Isabela

Como não encontrei como editar minha perguntei irei postar aqui meu real problema:

Como manipular as variáveis retornadas do servidor via DataTable e Ajax?

No trecho "defaultContent" eu preciso passar os valores das variáveis: id_usuario e id_brinde que estão vindo do servidor.


table = $(''.dataTable'').DataTable({
            ''destroy'':true,
            ''ajax'':{
                ''url'':DIRPAGE + ''/painel/exibir-brinde/todos'',
                ''method'':''GET'',
                ''dataSrc'':''''
            },

            ''columns'':[
                {''data'':''nome''},
                {''data'':''doc''},
                {''data'':''brinde''},
                {''data'':''data''},
                {''data'':''empresa''},
                {''defaultContent'':''<td class="id"><button class="btn btn-success btn-resgatar" value="id_usuario" id_brinde="id_brinde"><i class="fas fa-plus-circle"></i> Resgatar </button></td>''}
            ]
        });
Responder

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários,
consulte nossa política de privacidade.

Aceitar