使用Boostrap进行PHP和MYSQL的分页

时间:2016-11-07 20:19:42

标签: php mysql twitter-bootstrap pagination

我的数据库中有很多数据(包括图像,描述等)在一个页面中不合理的数据。 如何使用php,mysql和bootstrap进行分页?

enter image description here

 <?php

    $query = "SELECT Title, Painter_Name, Description, Year, Image FROM paintings, painters WHERE painters.ID = paintings.Painter_ID";

        $query_run = mysqli_query($connection, $query);

        while($row = mysqli_fetch_assoc($query_run)) {
      $title = $row['Title'];
      $painter = $row['Painter_Name'];
      $description = $row['Description'];
      $image = $row['Image'];
      $year = $row['Year'];
    ?>

      <div id="contatiner">

    <?php
      echo "
      <div class=\"row\">
        <div class=\"offset-sm-2 col-sm-8 offset-sm-2\"> 
            <div class=\"card\">
              <div class=\"card-block\">
                <h4 class=\"card-title text-sm-center\">$title ($year)</h4>
                <h6 class=\"card-subtitle text-sm-center text-muted\">$painter</h6>
              </div>
              <p class=\"text-sm-center\"><img style=\"width:300px; height:300px;\" src=\"$image\" alt=\"Card image\"></p>
              <div class=\"card-block\">
                <p class=\"card-text text-sm-center\">$description</p>
                <p class=\"text-sm-center\"><a href=\"#\" class=\"card-link\">Add to favorites</a></p>
              </div>
            </div>
        </div>
      </div>
         ";
        }
    ?>
    </div>
<nav class="text-xs-center">
    <ul class="pagination">
        <li class="page-item">
            <a href="#" class="page-link" aria-label="Previous">
                <span aria-hidden="true">&laquo;</span>
                <span class="sr-only">Previous</span>
            </a>
        </li>
        <li class="page-item"><a class="page-link" href="#">1</a></li>
        <li class="page-item"><a class="page-link" href="#">2</a></li>
        <li class="page-item"><a class="page-link" href="#">3</a></li>
        <li class="page-item"><a class="page-link" href="#">4</a></li>
        <li class="page-item"><a class="page-link" href="#">5</a></li>
        <li class="page-item">
            <a href="#" class="page-link" aria-label="Next">
                <span aria-hidden="true">&raquo;</span>
                <span class="sr-only">Next</span>
            </a>
        </li>
    </ul>
</nav>

我浏览过互联网,现在甚至不知道该怎么做......

提前致谢!

1 个答案:

答案 0 :(得分:0)

您可以使用限制和偏移进行查询:https://dev.mysql.com/doc/refman/5.5/en/select.html

  

使用两个参数,第一个参数指定要返回的第一行的偏移量,第二个参数指定要返回的最大行数。初始行的偏移量为0(不是1):

SELECT * FROM tbl LIMIT 5,10; # Retrieve rows 6-15

例如,第1页偏移0,限制10,每页增加偏移量和限制10(或任何你想要的)。

您可以为页面ID指定$ _GET var,或使用其他样式; MVC或获取网址的一部分。