03-Apr-2023
.
Admin
Hi friends,
In this post, we will learn how to use pagination with Load More using Ajax in PHP. i explained simply step by step how to ajax load more pagination in PHP. Here you will learn how to make ajax load more content, using button pagination in PHP. This tutorial will give you simple example of how to load more results in PHP, Ajax and MySQL from Database.
I will give you simple Example of how to Ajax based load more results with jQuery, MySQL and PHP.
So let's see bellow example:
index.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>PHP Ajax Pagination with Load More - Nicesnippets.com</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<div class="container mt-5">
<div class="row">
<div class="col-md-12">
<div class="card-header text-center bg-dark text-white">
<h4>PHP Ajax Pagination with Load More - Nicesnippets.com</h4>
</div>
<table class="table table-bordered" id="loadData">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>Username</th>
<th>Email</th>
<th>Age</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
loadMoreData();
function loadMoreData(page){
$.ajax({
url : "load.php",
type: "POST",
cache:false,
data:{page_no:page},
success:function(data){
if (data) {
$("#pagination").remove();
$("#loadData").append(data);
}else{
$(".loadbtn").prop("disabled", true);
$(".loadbtn").html('That is All');
}
}
});
}
$(document).on('click', '.loadbtn', function(){
$(".loadbtn").html('Loading...');
var pId = $(this).data("id");
loadMoreData(pId);
});
});
</script>
</body>
</html>
load.php
<?php
$sernamename = "localhost";
$username = "root";
$passoword = "";
$databasename= "demos";
$con = new mysqli($sernamename, $username,$passoword,$databasename);
if ($con->connect_error) {
die("Connection failed". $con->connect_error);
}
$limit = 5;
if (isset($_POST['page_no'])) {
$page = $_POST['page_no'];
}else{
$page = 0;
}
$sql = "SELECT * FROM users LIMIT $page, $limit";
$query = $con->query($sql);
if ($query->num_rows > 0) {
$output = "";
$output .= "<tbody>";
while ($row = $query->fetch_assoc()) {
$last_id = $row['id'];
$output.="<tr>
<td>{$row["id"]}</td>
<td>{$row["name"]}</td>
<td>{$row["username"]}</td>
<td>{$row["email"]}</td>
<td>{$row["age"]}</td>
</tr>";
}
$output .= "<tbody>";
$output .= "<tbody id='pagination'>
<tr>
<td colspan='5'><button class='btn btn-success loadbtn' data-id='{$last_id}' style='margin-left:500px'>Load More</button></td>
</tr>
</tbody>";
echo $output;
}
?>
Output:
I hope it will help you....
#PHP
