如何重新加载数据而不使用分页刷新页面

how to reload data without refreshing page with pagination

本文关键字:分页 刷新 何重新 加载 数据      更新时间:2023-09-26

我确实有下面的代码,我试图更新数据而不刷新分页页面。我尝试了很多从stackoverflow中获取的东西,但都没有成功。

PHP——

<?php
$auth_id = mysql_real_escape_string($_GET['id']);
$auths_id = mysql_real_escape_string($_GET['id']);
/**
 * @link: http://www.Awcore.com/dev
 */
    //connect to the database
    include_once ('db/config_books.php'); 
    //get the function
    include_once ('includes/function_ulema.php');

        $page = (int) (!isset($_GET["page"]) ? 1 : $_GET["page"]);
        $limit = 5;
        $startpoint = ($page * $limit) - $limit;
        //to make pagination
        $statement = "books b LEFT OUTER JOIN authors_compile_rel ar ON (b.id = ar.book_id)
        where b.status = 1 AND ( b.auth_id = '".$auth_id."' OR b.t_auth_id = '".$auth_id."' OR ar.auth_id = '".$auth_id."' )";
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>Pagination</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <link href="css/pagination_ulema.css" rel="stylesheet" type="text/css" />
    <link href="css/grey_ulema.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        .records {
            width: 510px;
            margin: 5px;
            padding:2px 5px;
            border:1px solid #B6B6B6;
        }
        .record {
            color: #474747;
            margin: 5px 0;
            padding: 3px 5px;
            background:#E6E6E6;  
            border: 1px solid #B6B6B6;
            cursor: pointer;
            letter-spacing: 2px;
        }
        .record:hover {
            background:#D3D2D2;
        }

        .round {
            -moz-border-radius:8px;
            -khtml-border-radius: 8px;
            -webkit-border-radius: 8px;
            border-radius:8px;    
        }    
    </style> 
</head>
<body>
    <div class="records round">
        <?php
            //show records
            $query = mysql_query("
SELECT 
b.id, b.unique_name, b.native_name, b.auth_id, b.status, b.create_date, ar.auth_id 
FROM books b LEFT OUTER JOIN authors_compile_rel ar ON (b.id = ar.book_id)
WHERE 
b.status = 1 AND ( b.auth_id = ".$auth_id." OR b.t_auth_id = ".$auth_id." OR ar.auth_id = ".$auth_id." )
ORDER by b.id DESC 
            LIMIT {$startpoint} , {$limit}");
            while ($row = mysql_fetch_assoc($query)) {
        ?>
            <div class="record round"><?php echo $row['id']; echo " - "; echo $row['unique_name']; ?></div>
        <?php    
            }
        ?>
    </div>
<?php
    echo pagination($statement,$limit,$page);
?>
</body>
</html>

和我确实有下面的分页功能文件:

<?php
$auth_id = mysql_real_escape_string($_GET['id']);
$auths_id = mysql_real_escape_string($_GET['id']);
/**
 * @link: http://www.Awcore.com/dev
 */
   function pagination($query, $per_page = 10,$page = 1, $url = '?' ){        
        $query = "SELECT COUNT(*) as `num` FROM {$query}";
        $row = mysql_fetch_array(mysql_query($query));
        $total = $row['num'];
        $auth_ids   =   $row['auth_id'];
        $adjacents = "2"; 
        $page = ($page == 0 ? 1 : $page);  
        $start = ($page - 1) * $per_page;                               
        $prev = $page - 1;                          
        $next = $page + 1;
        $lastpage = ceil($total/$per_page);
        $lpm1 = $lastpage - 1;
        $pagination = "";
        if($lastpage > 1)
        {   
            $pagination .= "<ul class='pagination'>";
                    $pagination .= "<li class='details'>Page $page of $lastpage</li>";
            if ($lastpage < 7 + ($adjacents * 2))
            {   
                for ($counter = 1; $counter <= $lastpage; $counter++)
                {
                    if ($counter == $page)
                        $pagination.= "<li><a class='current'>$counter</a></li>";
                    else
                        $pagination.= "<li><a href='{$url}page=$counter&id={$_GET['id']}'>$counter</a></li>";                   
                }
            }
            elseif($lastpage > 5 + ($adjacents * 2))
            {
                if($page < 1 + ($adjacents * 2))        
                {
                    for ($counter = 1; $counter < 4 + ($adjacents * 2); $counter++)
                    {
                        if ($counter == $page)
                            $pagination.= "<li><a class='current'>$counter</a></li>";
                        else
                            $pagination.= "<li><a href='{$url}page=$counter&id={$_GET['id']}'>$counter</a></li>";                   
                    }
                    $pagination.= "<li class='dot'>...</li>";
                    $pagination.= "<li><a href='{$url}page=$lpm1&id={$_GET['id']}'>$lpm1</a></li>";
                    $pagination.= "<li><a href='{$url}page=$lastpage&id={$_GET['id']}'>$lastpage</a></li>";     
                }
                elseif($lastpage - ($adjacents * 2) > $page && $page > ($adjacents * 2))
                {
                    $pagination.= "<li><a href='{$url}page=1&id={$_GET['id']}'>1</a></li>";
                    $pagination.= "<li><a href='{$url}page=2&id={$_GET['id']}'>2</a></li>";
                    $pagination.= "<li class='dot'>...</li>";
                    for ($counter = $page - $adjacents; $counter <= $page + $adjacents; $counter++)
                    {
                        if ($counter == $page)
                            $pagination.= "<li><a class='current'>$counter</a></li>";
                        else
                            $pagination.= "<li><a href='{$url}page=$counter&id={$_GET['id']}'>$counter</a></li>";                   
                    }
                    $pagination.= "<li class='dot'>..</li>";
                    $pagination.= "<li><a href='{$url}page=$lpm1&id={$_GET['id']}'>$lpm1</a></li>";
                    $pagination.= "<li><a href='{$url}page=$lastpage&id={$_GET['id']}'>$lastpage</a></li>";     
                }
                else
                {
                    $pagination.= "<li><a href='{$url}page=1&id={$_GET['id']}'>1</a></li>";
                    $pagination.= "<li><a href='{$url}page=2&id={$_GET['id']}'>2</a></li>";
                    $pagination.= "<li class='dot'>..</li>";
                    for ($counter = $lastpage - (2 + ($adjacents * 2)); $counter <= $lastpage; $counter++)
                    {
                        if ($counter == $page)
                            $pagination.= "<li><a class='current'>$counter</a></li>";
                        else
                            $pagination.= "<li><a href='{$url}page=$counter&id={$_GET['id']}'>$counter</a></li>";                   
                    }
                }
            }
            if ($page < $counter - 1){ 
                $pagination.= "<li><a href='{$url}page=$next&id={$_GET['id']}'>Next</a></li>";
                $pagination.= "<li><a href='{$url}page=$lastpage&id={$_GET['id']}'>Last</a></li>";
            }else{
                $pagination.= "<li><a class='current'>Next</a></li>";
                $pagination.= "<li><a class='current'>Last</a></li>";
            }
            $pagination.= "</ul>'n";        
        }

        return $pagination;
    } 
?>

请帮助我与集成的javascript加载数据分页不刷新页面。

您正在寻找的称为Ajax。看看这里:http://www.w3schools.com/ajax/ajax_intro.asp当用户单击下一页时,您可以使用JS捕获该动作,并将所选页面推送到Ajax脚本,然后计算要加载的新数据的偏移量。这是你想要的答案还是你想要的代码?