在分页数之间添加点

时间:2016-07-15 17:25:53

标签: php jquery ajax pagination

我已经在PHP和AJAX中为表格编写了一个分页代码。在每个页面中,它将显示该表的8行。它工作正常,直到这里。

我现在需要的是使分页看起来像它们之间的一系列数字和点,如(1 2 3 .... 27 28 29)

我有两个分页文件:

conf.php

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" id="font-awesome-style-css"
        href="http://phpflow.com/code/css/bootstrap3.min.css" type="text/css" 
        media="all">
    <script type="text/javascript" charset="utf8"
         src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js">
    </script>
</head>

<body>

    <div>
        <p> Table <br/> </p>
        <div id="target" >Loading ...</div>

        <?php
            include('dbconnect.php'); 
            $limit = 8;
            $sql = "SELECT * FROM places";  
            $rs_result = mysqli_query($connect,$sql);   
            $c = mysqli_num_rows($rs_result); //count number of rows
            $total_num_pages = ceil($c / $limit); 
        ?>

        <div align="center">
            <ul class='pagination text-center' id="pagination">
            <?php 
            if(!empty($total_num_pages)):for($j=1; $j<=$total_num_pages; $j++):
                if($j == 1):?>
                    <li class='active' id="<?php echo $j;?>">
                        <a href='paginate.php?page=<?php echo $j;?> '><?php echo $j;?></a>
                    </li> 
                <?php else:?>
                    <li id="<?php echo $j;?>">
                        <a href='paginate.php?page=<?php echo $j;?>'><?php echo $j;?></a>
                    </li>
                <?php endif;?>          
            <?php endfor;endif;?>
            </ul>  
        </div>
    </div>
    <script>
        jQuery(document).ready(function() {
        jQuery("#target").load("paginate.php?page=1");
            jQuery("#pagination li").live('click',function(e){
            e.preventDefault();
                jQuery("#target").html('loading...');
                jQuery("#pagination li").removeClass('active');
                jQuery(this).addClass('active');
                var pageNum = this.id;
                jQuery("#target").load("paginate.php?page=" + pageNum);
            });
            });
    </script>
</body>

第二个是paginate.php

<?php
    include('dbconnect.php');

    $limit = 8;  
    if (isset($_GET["page"])) { $page  = $_GET["page"]; } else { $page=1; };  
    $start_from = ($page-1) * $limit;  

    $query = "SELECT * FROM places ORDER BY id ASC LIMIT $start_from, $limit";  
    $result = mysqli_query($connect,$query); 

    if(!$query)
    {
        echo mysql_error();
    }
?>

<?php 
    echo '<p style="color:#003566;font-size:15px;">  &nbsp; You are on page ' .$page. '<br> </p>';
    echo '<table border="1" align="center">';

    echo '<tr><th>Name</th><th>link</th><th>My date</th><th>End date</th><th>place</th></tr>';

    while ($row = mysqli_fetch_assoc($result)) { 
        echo "<tr><td>";
        echo $row['name']; 
        echo "</td><td>";
        echo $row['link']; 
        echo "</td><td>";   
        echo $row['date'];
        echo "</td><td>";
        echo $row['end']; 
        echo "</td><td>";   
        echo $row['place'];
        echo "</td></tr>";   
    }
    echo '</table>';
?>

有人能告诉我这样做的方法吗?

1 个答案:

答案 0 :(得分:0)

<?php
$numbers = array(1,2,3,4,5,6,7,8,9,10,11,12);
$output = '';
$counter = 1;
foreach ($numbers as $number){
    if($counter == 4){
        $output .= ' ...';
    }elseif($counter < 4 || $counter > (count($numbers) -3)){
        $output .= ' ' . $number;
    }
    $counter++;
}

Check this link also