Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

rafiuskybreno

"Erro" múltiplos DataTables's em uma página

Recommended Posts

Olá Galera estou com o seguinte problema, estou desenvolvendo um sistema onde terá 4 tabelas de pesquisa, para deixar tudo organizado e com um campo "Search:" funcional optei por utilizar o DataTable junto ao BootStrap, porém está ocorrendo o seguinte erro, apenas na primeira tabela funciona a pesquisa e paginação, nas outras seguintes não funciona. O que notei é que, eu possuo uma arquivo "Raw" onde tem uma página onde há 2 DataTable's em uma página e estão 100% funcionais, e a única diferença entre a página do meu sistema e a do "Raw" é que na do sistema eu faço as linhas da tabela utilizando php em uma laço "for()" e na página "Raw" estão cadastradas cada registro na própria página, como que poderia resolver isso?

Código php: https://pastebin.com/xutdL6bc
Código JS: https://pastebin.com/3hfjQcct

-----Edit-----

Ao remover a 1° tabela completamente a segunda começa a funcionar 100% com paginação, quantidade de registros por página e pesquisa.

Compartilhar este post


Link para o post
Compartilhar em outros sites
Em 17/10/2017 at 06:02, wootzor disse:

Não sei se é aí que está o problema mas deves evitar ter dois ou mais elementos com o mesmo ID.

Então, consegui resolver o problemas, era o conflito de ID e o armazenamento em Cache do chrome, que mesmo atualizando as ID, continuava com o erro.

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por Jack Oliveira
      Ola pessoal tarde ou boa noite 
       
      É o seguinte tenho mais de 10 mil registro no banco de dados, no DATATABLE esta demorando um pouco para fazer o carregamento destas informações
      o tempo varia entre 16 á 20, 25 segundos para obter uma resposta.
       
      Queria que esta resposta pudessem ser mais rápida, se teria como claro ela ser mais rápida possível...
       
      Fiz um novo teste quantidade de arquivos 1mil arquivos a resposta é bem rapida não demora nem 3 segundo 
       
      Estou usando via ajax e json
       
      <script type="text/javascript"> $(function () { $("#DataTableAjaxDT").DataTable({ "pageLength": 20, "paging": true, "lengthChange": true, "ajax": "ajax/registros.php", "searching": true, "aLengthMenu": [ [5, 10, 15, 20, 25, 30, 35, -1], [5, 10, 15, 20, 25, 30, 35, "Todos"] ], "ordering": true, "info": true, "autoWidth": true, "columnDefs": [{ "targets": 'no-sort', "orderable": false, }], "language": { "sEmptyTable": "Nenhum registro encontrado", "sInfo": "Mostrando de _START_ até _END_ de _TOTAL_ registros", "sInfoEmpty": "Mostrando 0 até 0 de 0 registros", "sInfoFiltered": "(Filtrados de _MAX_ registros)", "sInfoPostFix": "", "sInfoThousands": ".", "sLengthMenu": "Mostrar _MENU_ resultados por página", "sLoadingRecords": "Carregando...", "sProcessing": "Processando...", "sZeroRecords": "Nenhum registro encontrado", "sSearch": "Pesquisar", "oPaginate": { "sNext": "Próximo", "sPrevious": "Anterior", "sFirst": "Primeiro", "sLast": "Último" }, "oAria": { "sSortAscending": ": Ordenar colunas de forma ascendente", "sSortDescending": ": Ordenar colunas de forma descendente" } } }); }); </script>  
       
       
       
    • Por DuduBacteria
      Olá,
      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>'} ] });  
    • Por Jack Oliveira
      Ola pessoa se a minha duvida estiver no topic errado pessoa desculpas
       
      Mais é o seguinte fiz uns arquivos formato json funciona perfeitamente 
      porem alguns deles tem opção de abrir modal para cadastro e edição
       
      mais eles não esta abrindo DataTable
       
      Se eu fazer sem usar datatable direto no arquivo ele abre
       
      o script esta da seguinte forma
      <script type="text/javascript"> $(function () { $("#DataTableAjax").DataTable({ "pageLength": 25, "processing": true, "serverSide": true, "ajax": "ajax/<?php echo $UrlPage; ?>", "aLengthMenu": [ [5, 10, 15, 20, 25, 30, 35, 40, 45, 50, 100, -1], [5, 10, 15, 20, 25, 30, 35, 40, 45, 50, 100, "Todos"] ], "paging": true, "lengthChange": true, "searching": true, "ordering": true, "info": true, "autoWidth": true, "columnDefs": [{ "targets": 'no-sort', "orderable": false, }], "language": { "sEmptyTable": "Nenhum registro encontrado", "sInfo": "Mostrando de _START_ até _END_ de _TOTAL_ registros", "sInfoEmpty": "Mostrando 0 até 0 de 0 registros", "sInfoFiltered": "(Filtrados de _MAX_ registros)", "sInfoPostFix": "", "sInfoThousands": ".", "sLengthMenu": "Mostrar _MENU_ resultados por página", "sLoadingRecords": "Carregando...", "sProcessing": "Processando...", "sZeroRecords": "Nenhum registro encontrado", "sSearch": "Pesquisar", "oPaginate": { "sNext": "Próximo", "sPrevious": "Anterior", "sFirst": "Primeiro", "sLast": "Último" }, "oAria": { "sSortAscending": ": Ordenar colunas de forma ascendente", "sSortDescending": ": Ordenar colunas de forma descendente" } } }); }); </script> Bom acho que o arquivo a seguir não tem nada a ver, mais irei colocar mesmo assim. Na parte onde se o arquivo ajax/lojas.php que seria em formato json
      esta assim
       
      <?php return ob_get_clean(); } ), array( 'db' => 'id_empresa', 'dt' => 10, 'formatter' => function ($id_empresa, $row) { ob_start(); $ImprimirPermissao = GetPermissaoAcesso(); ?> <?php if (checkPermissao($ImprimirPermissao, 'lojas', 'produto', 'renovar')) { ?> <a class="btn btn-primary" href="#" data-toggle="modal" data-target="#modalRenovar_<?= $row['id_empresa'];?>"><i title="Nova data de renovação" class="fa fa-calendar" aria-hidden="true"></i></a> <?php } ?>  
      Modal assim
       
      <?php $Query = DBRead('lojas','*'); if (is_array($Query)) { foreach ($Query as $dados) { ?> <div class="modal fade" id="modalRenovar_<?= $id_empresa;?>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog modal-lg" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h4 class="modal-title" id="myModalLabel"><b>LOJA: </b><?= $nome_empresa;?></h4> </div> <div class="modal-body"> <form method="post" action="?AtualizarEmpresa=<?= $id_empresa; ?>" enctype="multipart/form-data"> <div class="form-group"> <label>Nova data:</label> <input class="form-control" type="date" name="empresa_data_renovacao" required placeholder="00/00/0000"> </div> </div> <div class="modal-footer"> <input type="hidden" name="user_id" value="<?=$user_id;?>"> <center><hr> <button class="btn btn-primary">Atualizar</button> <br><br> </center> </form> </div> <div class="modal-footer"> </div> </div> </div> </div> <?php }} ?>  
    • Por ronanjos
      Quando vou pesquisar aparece este erro da imagem
       
      Pesquisando, descobri o erro da imagem abaixo seguindo os seguintes passos
      1. Para acessar as ferramentas do desenvolvedor no Chrome:
      Mac: acesse a opção de menu Visualizar> Desenvolvedor> Ferramentas do desenvolvedor .
      Windows: clique no menu do Google Chrome (à direita da barra de endereço) e selecione Ferramentas> Ferramentas do desenvolvedor .
       
      2. As ferramentas do desenvolvedor são mostradas na parte inferior da janela atual do navegador. O Chrome mostrará o console JavaScript por padrão.
      Clique na guia Rede para ver solicitações de rede
      Atualize a página para permitir que o Chrome capture todas as solicitações
       
      3. O painel da rede mostrará todas as solicitações feitas pelo Chrome para carregar a página.
      Clique na opção XHR na parte inferior da janela para reduzir as solicitações apenas para as solicitações do Ajax (XHR).
      Clique duas vezes na solicitação do Ajax feita pelo DataTables
       
      4.Detalhes sobre a solicitação do Ajax são mostrados.
      Clique na guia Reponse na visualização do Ajax para ver os dados exatos que foram retornados do servidor. É nisso que estamos interessados!
       
      E não consigo fazer as pesquisas. E Pesquisando mais um pouco descobri que o "$_REQUEST",  não é confiável pq ele pode ser facilmente burlado.
      Eu resolvi o erro com este comando "$requestData = filter_input(INPUT_POST, 0);", mas mesmo assim não consigo fazer a pesquisa. No aguardo de uma resposta.


    • Por Maycon Yamamotto
      Como faço o sistema de arquivar rowgroup? 
       
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.