0

Queria usar esse date table, para pesquisar bastante dados do banco. Eu até consegui, porém demora 12 segundos para carregar a página. Pois tem muitos dados cadastrados. Alguém tem um exemplo de como poderia fazer ?

Segue o código:

Front:

<div class="container">
    <div class="row">
        <div class="col-md-12">
            <span class="titleCadastros">LISTAR FROTA</span>
        </div>
        <div class="col-md-12">
            <div class="row">
                <div class="col-md-6">
                    <span class="titleCadastros botaoCad"><a href="cadastrar-frotas.php">CADASTRAR FROTA</a></span>
                </div>
            </div>
        </div>
        <div class="col-md-12 m-b-50">           
            <table id="example" class="display" style="width:100%">
                <thead>
                    <tr>
                        <th>Nome das colunas</th>
                        <th>Nome das colunas</th>
                        <th>Nome das colunas</th>
                        <th>Nome das colunas</th>
                        <th>Nome das colunas</th>
                        <th>Nome das colunas</th>
                    </tr>
                </thead>
                <tbody>
                // Aqui eu coloquei o Laço de repetição
                <?php
                $read = new Read;
                $read->ExeRead('frota', 'ORDER BY id DESC');

                foreach ($read->getResult() as $v):
                   extract($v);

                ?>
                <tr class="odd">
                    <td>$dadosaqui</td>
                    <td>$dadosaqui</td>
                    <td>$dadosaqui</td>
                    <td>$dadosaqui</td>
                    <td>$dadosaqui</td>
                    <td>$dadosaqui</td>
                </tr>
                <?php
                endforeach;
                ?>
                </tbody>
                <tfoot>
                    <tr>
                        <th>Nome das colunas</th>
                        <th>Nome das colunas</th>
                        <th>Nome das colunas</th>
                        <th>Nome das colunas</th>
                        <th>Nome das colunas</th>
                        <th>Nome das colunas</th>
                    </tr>
                </tfoot>
            </table>

Js:

$(document).ready(function() {
    $('#example').DataTable({
        "processing": true,
        "serverSide": true,
        "ajax": "js/scripts/recebe_frotas.php",
        "deferLoading": 57,
        "oLanguage": {
                    "sProcessing":   "Processando...",
                    "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":          "",
                    "oPaginate": {
                        "sFirst":    "Primeiro",
                        "sPrevious": "Anterior",
                        "sNext":     "Seguinte",
                        "sLast":     "Último"
                    }
                }
    });    
} );

Arquivo que recebe o Js (recebe_frotas.php)

/*
 * DataTables example server-side processing script.
 *
 * Please note that this script is intentionally extremely simply to show how
 * server-side processing can be implemented, and probably shouldn't be used as
 * the basis for a large complex system. It is suitable for simple use cases as
 * for learning.
 *
 * See http://datatables.net/usage/server-side for full details on the server-
 * side processing requirements of DataTables.
 *
 * @license MIT - http://datatables.net/license_mit
 */

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Easy set variables
 */

// DB table to use
$table = 'frota';

// Table's primary key
$primaryKey = 'id';

// Array of database columns which should be read and sent back to DataTables.
// The `db` parameter represents the column name in the database, while the `dt`
// parameter represents the DataTables column identifier. In this case simple
// indexes
$columns = array(
    array( 'db' => 'id', 'dt' => 0 ),
    array( 'db' => 'seguradora_id',  'dt' => 1 ),
    array( 'db' => 'rastreador_id',   'dt' => 2 ),
    array( 'db' => 'placacavalo',     'dt' => 3 )    
);

// SQL server connection information
$sql_details = array(
    'user' => 'root',
    'pass' => '',
    'db'   => 'sistema_frota',
    'host' => 'localhost'
);


/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * If you just want to use the basic configuration for DataTables with PHP
 * server-side, there is no need to edit below this line.
 */

require( 'ssp.class.php' ); // na documentação tem esse arquivo, mas não sei o que seria!

echo json_encode(
    SSP::simple( $_GET, $sql_details, $table, $primaryKey, $columns )
);
5
  • Olá, você pode usar consulta paginada em banco. Qual banco de dados você está usando? Commented 23/10/2018 às 2:33
  • Sim, até que usei, estou usando Mysql. É que a busca da date table é bem prático, mas quando tem muitos dados, ela demora para carregar a página.
    – user3081
    Commented 23/10/2018 às 8:06
  • Bom, pra ajudar seria mais fácil se você colocasse seu código do front, back e consulta que está fazendo no banco de dados. Commented 23/10/2018 às 13:00
  • Irei editar aqui, colocar o código certinho...
    – user3081
    Commented 23/10/2018 às 13:19
  • Já passei por essa situação, onde na montagem da página o carregamento dos dados, leva um tempo grande. Resolvi mandando uma porção dos dados (não todos) e criei um filtro de busca na página.
    – sant0will
    Commented 23/10/2018 às 18:24

1 Resposta 1

0

Galera, eu consegui arrumar o erro, eu simplesmente inclui o arquivo (ssp.class.php), que baixei aqui: https://github.com/DataTables/DataTables/blob/master/examples/server_side/scripts/ssp.class.php

E nos campos de do array, tem que ter a mesma quantidade das colunas da sua tabela:

Ficou assim:

$columns = array( array( 'db' => 'id', 'dt' => 0 ), array( 'db' => 'cliente_id', 'dt' => 1 ), array( 'db' => 'seguradora_id', 'dt' => 2 ), array( 'db' => 'rastreador_id', 'dt' => 3 ), array( 'db' => 'placacavalo', 'dt' => 4 ), array( 'db' => 'marca', 'dt' => 5 ), array( 'db' => 'modelo', 'dt' => 6 ), array( 'db' => 'data', 'dt' => 7 ), array( 'db' => 'chassi', 'dt' => 8 ) );

MAS AGORA A DÚVIDA É, COMO COLOCAR DOIS BOTÃO, DE EDITAR E EXCLUIR NO FINAL DA TABELA, SENDO QUE SE COLOCAR BOTÃO NO FINAL, A TABELA NÃO FUNCIONA :(

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .