4

Estou com dificuldades de encontrar uma maneira de fazer a paginação utilizando AJAX. Estou acostumado e fazê-la da maneira tradicional e diretamente com o servidor utilizando o Codeigniter como framework de aplicação. Porém, desta vez eu preciso que seja feita sem o refresh da página. Abaixo segue o código da paginação feita no Codeigniter. Qual a maneira correta de se utilizar o AJAX para essa aplicação?

# Preparando o limite da paginação

        $de_paginacao = ( $de_paginacao < 0 || $de_paginacao == 1 ) ? 0 : (int) $de_paginacao;

        # Carrega a biblioteca

        $this->load->library(array('pagination'));

        # Acessa o Model, executa a função get_all() e recebe os contatos

        $pedidos = $this->model_pedido->get_all($de_paginacao, $this->pedidos_pagina);

        # Paginação

        $config_paginacao['base_url'] = site_url('admin/all/');
        $config_paginacao['total_rows'] = $this->model_pedido->count_rows();
        $config_paginacao['per_page'] = 10;

        $this->pagination->initialize($config_paginacao);

        $dados['html_paginacao'] = $this->pagination->create_links();

OBS: este é o código padrão de paginação do Codeigniter. Existe outra forma?

1 Resposta 1

6

Use a paginação do codeigniter integrada com jquery.

Primeiramente adicione esse javascript em seu head:

  <script type="text/javascript">
  $(function() {
      $("#ajax_paging a").click(function() {
        var url = $(this).attr("href");
        $.ajax({
          type: "POST",
          data: "ajax=1",
          url: url,
          beforeSend: function() {
            $("#content").html("");
          },
          success: function(msg) {
            $("#content").html(msg);
          }
        });
        return false;
      });
    }
  });
  </script>

No controller que gera a paginacão

$dados['html_paginacao'] = $this->pagination->create_links();
if ($this->input->post('ajax')) {
    $this->load->view('contato/ajax_index', $dados);
} else {
    $this->load->view('contato/index', $dados);
}

Perceba que dependendo da requisição carregamos uma view diferente. A view ajax_index é minimalista e contém somente o que será substituído, ex:

<div id="data">
  <?php foreach($contato['nome'] as $u): ?>
      <div><?php echo $u; ?></div>
  <?php endforeach; ?>
</data>

<div id="ajax_paging">
  <?php echo $pagination; ?>
</div>

No controller index bote tudo em volta do #content

...
<div id="content">
    <div id="data">
      <?php foreach($contato['nome'] as $u): ?>
          <div><?php echo $u; ?></div>
      <?php endforeach; ?>
    </data>

    <div id="ajax_paging">
      <?php echo $pagination; ?>
    </div>
</div>
...

Essa é apenas algumas das formas de se fazer, mas todas tem em comum a requisição ajax e um controller que traga somente o que será substituído na página.

Veja também:

Codeigniter com Datatables

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 .