How to use next/previous button without redirecting to the php files?

userjdqb1 0
Viewed 19

I need help with my code as of now i have this

https://i.stack.imgur.com/b5yJL.png this is my table, it wont display any row until someone will press the search button,. if they did it will display this https://i.stack.imgur.com/9TpGG.png a list of row from database with pages, my problem is when i click the page it will display like this https://i.stack.imgur.com/6S4Nl.png it wont stay in the current page but redirect to the php files and i dont have any idea on what to do, the button is working btw, and it show the next right table in each page

here is my code for the page button

if($page>1)
 {
 echo "<a href='/api2/allrecords.php?page=".($page-1)."' class='btn btn-danger'>Previous</a>";
 }            
 for($i=1;$i<$total_page;$i++)
 {
 echo "<a href='/api2/allrecords.php?page=".$i."' class='btn btn-primary'>$i</a>";
      }
  if($i>$page)
  {
  echo "<a href='/api2/allrecords.php?page=".($page+1)."' class='btn btn-danger'>Next</a>";
  }

and here is for the sql

 if(isset($_GET['page']))
    {
        $page = $_GET['page'];
    }
    else
    {
        $page = 1;
    }

    $num_per_page = 20;
    $start_from = ($page-1)*02;


     $connect = mysqli_connect("127.0.0.1", "crudDBck69t", "NTCHilrXdf", "crudDBck69t"); 
      $output = '';  
      
           $query = "  
           SELECT * FROM rvtable limit $start_from,$num_per_page
      ";      
            $pr_query = "select * from rvtable";
            $pr_result = mysqli_query($connect,$pr_query);
             $total_record = mysqli_num_rows($pr_result );
             $total_page = ceil($total_record/$num_per_page);
      
      $result = mysqli_query($connect, $query);

there are all in the same php files call allrecord.php, but im displaying it on wordpress page.,

this is how i call it in my costume page template in wordpress

if(from_date == '' && to_date == '' && search == '')   {
                    $.ajax({  
                          url:"/api2/allrecords.php",  
                          method:"POST",  
                          data:{from_date:from_date, to_date:to_date, search:search},  
                          success:function(data)  
                          {  
                               $('#rvoucher').html(data);  
                          }  
                     });
                    
                }

and its working well except the page button, should i change the link on it? but the $_GET is on allrecord.php file any idea?

thanks

pagination php html
1 Answers

The problem you are having is that the POST data is not sent together with your GET request when the user clicks the link that is the next page button.

One solution could be to instead of using links where the href reloads the page use links that have a click event listener that would run your POST request again but only this time with the page selected.

Another thing, you shouldn't really be taking use input and putting it directly into your SQL queries as that exposes you solution to SQL injection

example of how to output buttons that should reload the table with the search data:

<script type="text/javascript">
    function gotoPage(page) {
        $.ajax({
            url:"/api2/allrecords.php?page=" + page,
            method:"POST",
            data: {
                from_date: atob("<?php echo base64_encode($_POST['from_date'] ?? ''); ?>"),
                to_date: atob("<?php echo base64_encode($_POST['to_date'] ?? ''); ?>"),
                search: atob("<?php echo base64_encode($_POST['search'] ?? ''); ?>"),
            },
            success: function(data) {
                $('#rvoucher').html(data);
            }
        });
    }
</script>
<?php
if ($page > 1) {
    echo '<a href="#" onclick="gotoPage(' . $page-1 . ')" class="btn btn-danger">Previous</a>';
}
for($i=1; $i < $total_page; $i++) {
    echo '<a href="#" onclick="gotoPage(' . $i . ')" class="btn btn-primary">' . $i . '</a>';
}
if($page < $total_page) {
    echo '<a href="#" onclick="gotoPage(' . $page+1 . ')" class="btn btn-danger">Next</a>';
}
?>
Sicet70
Related