Exibir dentro da tag corretamente - Jquery

[Giihh 6]

Olá, 

 

Quando eu clico nos links da paginação, todos funcionam corretamente, mas o unico problema é que dentro da tag table que esta com o id="ajaxList" exibe todo o conteudo da pagina novamente

 

Fomulario e Tabela

 

 

 

Conteudo da pagina exibido dentro do id="ajaxList" após clicar em algum link da paginação. A tela fica assim depois do primeiro clique, e ao clicar nos demais links o ajax continua carregando o conteudo certo de cada numero.

 

 

 

Jquery
    $(".page-link").click(function (e) {
       e.preventDefault();
    
       var url = $(this).attr("data-href");
    
       $( "body #ajaxList" ).load( url + "#ajaxList" );
    
    })

Console alert:

 

Citar

 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.

 

Eu tentei de diversas formas informar a sequencia de "parents tags", mas não funcionou.  Se eu deixar apenas 'body' funciona mas realmente quero entender como exibir apenas o conteudo do id indicado

 

  $( "#ajaxList" )
    
    $( "body #ajaxList" )
    
    $( "body .col #ajaxList" )
    
    $( "html body .col #ajaxList" )

 

Estou usando o `jquery-3.2.1`

class.crud.php
    public function paging($query,$records_per_page)
        {
            $starting_position=0;
            if(isset($_GET["page_no"]))
            {
                $starting_position=($_GET["page_no"]-1)*$records_per_page;
            }
            $query2=$query." limit $starting_position,$records_per_page";
            return $query2;
        }
        
        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 href='#' class='page-link' data-href='".$self."?page_no=1'>First</a></li>";
                    echo "<li class='page-item'><a  href='#' class='page-link' data-href='".$self."?page_no=".$previous."'>Previous</a></li>";
                }
                for($i=1;$i<=$total_no_of_pages;$i++)
                {
                    if($i==$current_page)
                    {
                        echo "<li class='page-item'><a href='#' class='page-link' data-href='".$self."?page_no=".$i."' style='color:red;'>".$i."</a></li>";
                    }
                    else
                    {
                        echo "<li class='page-item'><a href='#' class='page-link' data-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 href='#' class='page-link' data-href='".$self."?page_no=".$next."'>Next</a></li>";
                    echo "<li class='page-item'><a href='#' class='page-link' data-href='".$self."?page_no=".$total_no_of_pages."'>Last</a></li>";
                }
                ?></ul><?php
            }
        }
    

   
 index.php
 

  
    <table class="table table-hover" id="ajaxList">
                  <thead>
                    <tr>
                      <th >#</th>
                      <th style="display:none">id</th>
                      <th>Name</th>
                      <th>Email</th>
                      <th>Tel</th>
                      <th>City</th>
                      <th>Contry</th>
                      
                    </tr>
                  </thead>
                  <tbody >
    
                     <?php
                        $query = "SELECT * FROM crud 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>
                  </tbody>  
            </table>