Question

我试图为图像缩略图库实现ajax分页，但似乎我能理解这一点并且我想念一些东西。
所以这是我的HTML

<div class="row">                       
    <div class="loading-div"><img src="ajax-loader.gif" ></div>
    <div id="results"></div>
</div>

并在页面的头部

<script type="text/javascript">
$(document).ready(function() {
$("#results" ).load( "fetch_pages.php"); //load initial records

$("#results").on( "click", ".pagination a", function (e){
    e.preventDefault();
    $(".loading-div").show(); //show loading element
    var page = $(this).attr("data-page"); //get page number from link
    $("#results").load("fetch_pages.php",{"page":page}, function(){ //get content from PHP page
        $(".loading-div").hide(); //once done, hide loading element
    });

});
});
</script>

和php部分

if(isset($_POST) && isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
//continue only if $_POST is set and it is a Ajax request
if(isset($_GET['album_id']) && is_numeric($_GET['album_id'])){
        $album_id = $_GET['album_id'];

include("config.inc.php");  //include config file
//Get page number from Ajax POST
if(isset($_POST["page"])){
    $page_number = filter_var($_POST["page"], FILTER_SANITIZE_NUMBER_INT, FILTER_FLAG_STRIP_HIGH); //filter number
    if(!is_numeric($page_number)){die('Invalid page number!');} //incase of invalid page number
}else{
    $page_number = 1; //if there's no page number, set it to 1
}

//get total number of records from database for pagination
$results = $mysqli_conn->query("SELECT COUNT(*) FROM images");
$get_total_rows = $results->fetch_row(); //hold total records in variable
//break records into pages
$total_pages = ceil($get_total_rows[0]/$item_per_page);

//get starting position to fetch the records
$page_position = (($page_number-1) * $item_per_page);

//SQL query that will fetch group of records depending on starting position and item per page. See SQL LIMIT clause
$results = $mysqli_conn->query("SELECT * FROM images WHERE image_album = '$album_id' ORDER BY image_id ASC LIMIT $page_position, $item_per_page");

//Display records fetched from database.

while($row = $results->fetch_assoc()) {
    echo '<div class="col-md-4 col-ms-6">
                          <div class="g-item">
                                   <img src="../images/gallery/thumb/'.$row['image_name'].'">
                                <a data-rel="lightbox" class="overlay" href="../images/gallery/thumb/'.$row['image_name'].'">
                                    <span>+</span>
                                </a>
                       </div> <!-- /.g-item -->
              </div> <!-- /.col-md-4 -->';
}   

echo '<div align="center">';
echo paginate_function($item_per_page, $page_number, $get_total_rows[0], $total_pages);
echo '</div>';

} 
} else { echo "no items in this album"; }

我尝试实现的是当用户点击类别（which already is working fine）以加载包含此类别（相册）中的图像的新页面，然后几乎没有拇指和分页。当我使用$ _GET删除部件时，我需要获取album_id以便仅显示这些图像。这是索引页面上的按钮

gallery.php?album_id='.$row['album_id'].'

我遵循的教程是from here

页面上没有错误也没有图片..

Answer 1

你没有将album_id发送到你的剧本

$("#results").load("fetch_pages.php",{"page":page},

您只需添加应加载的页面而不是相册ID。

其次，您通过邮寄发送数据。邮件请求中$ _GET始终为空。

PHP和AJAX分页

1 个答案: