[英]How to add pagination in php image grid view?
我想在一页中的网格视图中显示所有产品图像，但是由于有成千上万的产品，并且我想添加分页以获得更好的UI。
以下是我的代码以网格视图显示图像-
<!DOCTYPE html>
<html>
<head>
<title>Images Grid View</title>
<style type="text/css">
#thumb {
clear : both;
width : 100%;
margin-left : 0;
}
#thumb ul {
width : 100%;
}
#thumb ul li {
display : inline;
font-family : arial;
float : left;
padding-right : 5px;
width: 210px;
height : 280px;
}
#thumb ul li img {
float : left;
width : 200px;
height : 200px;
border : #ccc solid 1px;
padding : 2px;
}
</style>
</head>
<body>
</body>
</html>
<?php
$rootPath = '/var/www/html/';
require_once $rootPath.'app/bootstrap.php';
$bootstrap = \Magento\Framework\App\Bootstrap::create(BP, $_SERVER);
$objManager = $bootstrap->getObjectManager();
$state = $objManager->get('\Magento\Framework\App\State');
$state->setAreaCode('frontend');
$resource = $objManager->get('\Magento\Framework\App\ResourceConnection');
$connection = $resource->getConnection('core_write');
$entity_ids = array(10,100,1000,1001,116962,112694,116049,116960);
foreach ($entity_ids as $entity_id) {
$oldImage = array();
$media_results = $connection->query("SELECT value_id from catalog_product_entity_media_gallery_value where entity_id ='".$entity_id."'")->fetchAll();
if(!empty($media_results)){
echo '<div id="thumb"><ul>';
foreach($media_results as $valueids){
$value_id = $valueids['value_id'];
$oldimg = $connection->fetchOne("select value from catalog_product_entity_media_gallery where value_id = '".$value_id."' limit 1");
$oldImage[] = $oldimg;
echo '<li><p>' . $entity_id .'</p>';
echo '<img src="https://testwebsite.com/pub/media/catalog/product/'.$oldimg.'" alt="Image" />';
echo '</li>';
}
echo '</ul></div>';
}
}
?>
图像在网格视图中正确显示，但我想添加分页以在每个页面上仅显示3个产品。
任何建议，将不胜感激。
经过这么多的耐心，我已经了解了添加分页和使用bootstrap分页的每个标准。
以下是我的答案。 希望对别人有帮助。
<!DOCTYPE html>
<html>
<head>
<title>Images Grid View</title>
<style type="text/css">
#thumb {
clear : both;
width : 100%;
margin-left : 0;
}
#thumb ul {
width : 100%;
}
#thumb ul li {
display : inline;
font-family : arial;
float : left;
padding-right : 5px;
width: 210px;
height : 280px;
}
#thumb ul li img {
float : left;
width : 200px;
height : 200px;
border : #ccc solid 1px;
padding : 2px;
}
</style>
</head>
<body>
<?php
$conn = mysqli_connect("localhost", "root", "test123#", "imagesdatabase") or die("unable to connect");
$rootPath = '/var/www/html/';
require_once $rootPath.'app/bootstrap.php';
$bootstrap = \Magento\Framework\App\Bootstrap::create(BP, $_SERVER);
$objManager = $bootstrap->getObjectManager();
$state = $objManager->get('\Magento\Framework\App\State');
$state->setAreaCode('frontend');
$resource = $objManager->get('\Magento\Framework\App\ResourceConnection');
$connection = $resource->getConnection('core_write');
$rec_limit = 6;
$rec_count = 50;
if (isset($_GET['pageno'])) {
$pageno = $_GET['pageno'];
} else {
$pageno = 1;
}
$no_of_records_per_page = 12;
$offset = ($pageno-1) * $no_of_records_per_page;
$total_pages_sql = "SELECT count(e.entity_id) from catalog_product_entity_media_gallery g join catalog_product_entity_media_gallery_value v on (g.value_id = v.value_id) join catalog_product_entity e on (v.entity_id = e.entity_id) where e.attribute_set_id = 62";
$result = mysqli_query($conn,$total_pages_sql);
$total_rows = mysqli_fetch_array($result)[0];
$total_pages = ceil($total_rows / $no_of_records_per_page);
$entity_ids = mysqli_query($conn,"SELECT e.entity_id,g.value_id,g.value from catalog_product_entity_media_gallery g join catalog_product_entity_media_gallery_value v on (g.value_id = v.value_id) join catalog_product_entity e on (v.entity_id = e.entity_id) where e.attribute_set_id = 62 limit $offset, $no_of_records_per_page");
echo '<div id="thumb"><ul>';
while ( $row=mysqli_fetch_array($entity_ids,MYSQLI_ASSOC)) {
$entity_id = $row['entity_id'];
$image = $row['value'];
echo '<li><p>' . $entity_id .'</p>';
echo '<img src="https://testwebsite.com/pub/media/catalog/product/'.$image.'" alt="Image" /></a>';
echo '</li>';
}
echo '</ul></div>';
?>
<center>
<ul class="pagination" style="list-style-type:none; display:-webkit-inline-box !important; float: left; font-size: 24px;">
<li style="background-color:gray;"><a href="?pageno=1">First</a></li>
<li style="background-color:gray;" class="<?php if($pageno <= 1){ echo 'disabled'; } ?>">
<a href="<?php if($pageno <= 1){ echo '#'; } else { echo "?pageno=".($pageno - 1); } ?>">Prev</a>
</li>
<li style="background-color:gray;" class="<?php if($pageno >= $total_pages){ echo 'disabled'; } ?>">
<a href="<?php if($pageno >= $total_pages){ echo '#'; } else { echo "?pageno=".($pageno + 1); } ?>">Next</a>
</li>
<li style="background-color:gray;"><a href="?pageno=<?php echo $total_pages; ?>">Last</a></li>
</ul>
</center>
</body>
</html>
如何在 php、bootstrap、css 中向列表/网格视图添加分页？
[英]How to add pagination to list/grid view in php, bootstrap, css?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.