0

Tenho um código de paginação normal, está funcionando corretamente, mas não estou conseguindo inserir ajax na paginação.

Na verdade como estou usando funções, não sei como chamar a função "paginglink" na url do AJAX

Outro ponto é que o código tem $self = $_SERVER['PHP_SELF']; que retorna a url atual, como substituo a variavel $self no links da paginação ao usar o Ajax?

<?php
        $query = "SELECT * FROM users ORDER BY id DESC";       
        $records_per_page=7;
        $newquery = $crud->paging($query,$records_per_page);
        $crud->dataview($newquery);
     ?>
    <tr>
        <td colspan="7" align="center">
            <nav aria-label="Page navigation example">
            <?php $crud->paginglink($query,$records_per_page); ?>
            </nav>
        </td>
    </tr>

class.crud.php

public function paginglink($query,$records_per_page)
    {

        $self = $_SERVER['PHP_SELF'];

        $stmt = $this->db->prepare($query);
        $stmt->execute();

        $total_no_of_records = $stmt->rowCount();

        if($total_no_of_records > 0)
        {
            ?><ul class="pagination"><?php
            $total_no_of_pages=ceil($total_no_of_records/$records_per_page);
            $current_page=1;
            if(isset($_GET["page_no"]))
            {
                $current_page=$_GET["page_no"];
            }
            if($current_page!=1)
            {
                $previous =$current_page-1;
                echo "<li class='page-item'><a class='page-link' href='".$self."?page_no=1'>First</a></li>";
                echo "<li class='page-item'><a class='page-link' href='".$self."?page_no=".$previous."'>Back</a></li>";

            }
            for($i=1;$i<=$total_no_of_pages;$i++)
            {
                if($i==$current_page)
                {
                    echo "<li class='page-item'><a class='page-link' href='".$self."?page_no=".$i."' style='color:red;'>".$i."</a></li>";
                }
                else
                {
                    echo "<li class='page-item'><a class='page-link' href='".$self."?page_no=".$i."'>".$i."</a></li>";
                }
            }
            if($current_page!=$total_no_of_pages)
            {
                $next=$current_page+1;
                echo "<li class='page-item'><a class='page-link' href='".$self."?page_no=".$next."'>Next</a></li>";
                echo "<li class='page-item'><a class='page-link' href='".$self."?page_no=".$total_no_of_pages."'>Last</a></li>";
            }
            ?></ul><?php
        }
    }

Ajax:

<script>
             $.ajax({  
                    url:"???",  
                    method:"POST",  
                    data:,  
                    success: ;  
                    }  
               }) 
    </script>
1
  • $_SERVER['PHP_SELF'] retorna a url atual. Se você manda a requisição via ajax, e no Ajax a função é chamada, a url atual será a url do Ajax. Não entendi qual é o problema. Poderia detalhar melhor? 9/09/2017 às 14:39

1 Resposta 1

1

Se você quer fazer a paginação via ajax, sugiro uma pequena edição no seu código.

No trecho onde você coloca o link com o número da url no href, eu colocaria num data-href e pegaria esse valor via Javascript.

Exemplo:

"<a href='#' class='page-link' data-href='".$self."?page_no=".$previous."'>Back</a>";

Agora, ao invés de fazer a requisição normalmente pelo click no link com href, você poderia adicionar uma função jQuery, para fazer a requisição ajax para a url que está em data-href. Por exemplo:

$('.page-link').click(function (e) {
   e.preventDefault();

   var url = $(this).data('href');

   $.ajax({
         url: url,

         success: function (response) {
              $('#conteudo-da-paginacao').html(response)
         }
   });
})

atualização

O autor da pergunta me questionou a respeito do conteúdo carregar a mesma página, e portanto, ele precisa de carregar apenas a div, e não todo o conteúdo.

Tem como usar a função load do jQuery. Com ela é possível carregar apenas um elemento específico de uma determinada página. Veja:

$('.page-link').click(function (e) {
   e.preventDefault();

   var url = $(this).data('href');

   $( "#conteudo-da-pagina" ).load( url + " #conteudo-da-pagina" );

})

Documentação do load

8
  • Obrigada Wallace, funcionou a paginação mas com um porem: Eu tenho duas colunas bootstrap, a esquerda um formulario de cadastro e a direita a lista do que ja foi cadastrado e que contem a paginação. Ao clicar na paginacação ( eu coloquei o id na tag table na tag <table #conteudo-da-paginacao>) a pagina inteira é duplicada la dentro, então a paginação esta funcionando mas o conteudo da tela inteira esta aparecendo na tag table
    – Gislef
    9/09/2017 às 17:55
  • var url = $(this).data('href'); vai retornar a tela inteira dentro de #conteudo-da-paginacao como faço para na variavel url pegar apenas o proprio id #conteudo-da-paginacao dentro da url e responder nesse mesmo id?
    – Gislef
    9/09/2017 às 18:03
  • @Gislef tem como sim. $(response).find('#conteudo-da-paginacao').html() 9/09/2017 às 18:21
  • substituo $('#conteudo-da-paginacao').html(response) por $(response).find('#conteudo-da-paginacao').html()? desta forma não funcionou os botões ficaram sem ação
    – Gislef
    9/09/2017 às 18:25
  • $('#conteudo-da-paginacao').html($(response).find('#conteudo-da-paginacao').html()). Você está inserido a mesma página, porém apenas a parte do #conteudo. No jQuery tem outras forma de fazer, vou dar uma relembrada. Só um minuto 9/09/2017 às 18:41

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 .