时间戳

首页 > 解决方案 > 如何有效地为许多产品提供 1 个 html 布局页面，这些产品将调用 mysql 数据库获取产品信息并插入我指定的位置？

php - 如何有效地为许多产品提供 1 个 html 布局页面，这些产品将调用 mysql 数据库获取产品信息并插入我指定的位置？

问题描述

好的，所以最终我将在 mysql 数据库中说 100 种产品。产品页面从数据库中提取所有信息（例如零件编号、材料、颜色等）并将其输入到我指定的页面区域中，所有这些都使用 php。上一页将显示所有 100 种产品，当用户单击一个产品时，它将转到该产品页面。就像所有网站一样...

我不相信我需要为每个产品制作 100 个单独的 html 页面，对吗？我可以只制作 1 个主 html 页面作为 100 种不同产品的模板吗？基本上，当用户单击产品的图像标签（代码的第一个示例）时，它会打开主 html 模板，但会以某种方式在打开时调用数据库并加载该特定信息？然后其他产品将具有相同的过程，但它们是来自数据库的特定数据。第一个示例代码是页面上的一个产品，它将显示所有 100 个产品，其 href 包含将被点击以显示用户实际产品页面，无需重新加载页面即可动态检索到预定部分。我确信我想要做的事情有一个名字，但我所做的所有研究都没有找到我想要的东西。有没有比我解释的更好的方法？我也希望这是有道理的，谢谢您的任何意见。

<td><a href="pageContent.php"><img class="td-Image" src="image.jpg"></a>
 </td>
 <td class="td-manufacturer">
   <h6>MANUFACTURER</h6>
   <p>Lowes</p>
 </td>
 <td class="td-addComponent">
   <p>$104.99</p>
   <a href="#"><button class="add-button">ADD</button></a>
 </td>
 <td class="td-material">
   <h6>MATERIAL</h6>
   <p>Aluminum 7075-t6 Forged</p>
 </td> 
 <td class="td-platform">
   <h6>PLATFORM</h6>
   <p>Large</p>
 </td>
 <td class="td-america">
   <h6>AMERICAN MADE</h6>
   <p>YES</p>
 </td>

php 从数据库示例中获取信息的实际产品页面

<?php
$sql = "SELECT * FROM Parts;";
$result = mysqli_query($conn, $sql);
$resultCheck = mysqli_num_rows($result);

if($resultCheck > 0) {
while ($row = mysqli_fetch_assoc($result)) {

?>

<div class="description">
  <h3>Descrption</h3>
  <p>
    <?php 
     echo $row['Description'];
    ?>
  </p>
</div>

<?php
}
}
?>

编者注：我编辑了这个问题，以根据下面我的回答中的主题来反映他想要什么。

标签： phphtmlmysqlajax

解决方案

最佳情况下，您需要 2 个文件：

  • 索引/产品列表
  • 所选产品的详细信息

索引文件（也许叫它index.php）

在这里，您需要选择产品并将其列为列表：

$stmt = $pdo->query("SELECT * FROM Parts");
while ($row = $stmt->fetch()) {
    echo '<a href="javascript:loadDetail(\'' . $row['id'] . '\')">' . $row['name']."</a><br />\n";
}

由于您希望将详细信息显示到索引/列表页面，让我们添加一个容器区域：

<div id="container-detail">

</div>

添加一些 javascript 代码来处理 AJAX 请求：

<script type="text/javascript">
    function loadDetail(itemId){
        var xhr = new XMLHttpRequest();
        xhr.open("GET", "http://website.address/path/to/detail.php?id=" + itemId, true);
        
        xhr.onreadystatechange = function ()
        {
            if (xhr.readyState==4 && xhr.status==200)  
            {
                document.getElementById("container-detail").innerHTML=xhr.responseText;
            }
        }

        xhr.send();

    }
</script>

详细信息页面（我们称之为detail.php）

在此屏幕中，我们仅获取由HTTP GET id参数指定的一部分的详细信息。从index.php（?id=零件）提供的那个。

$stmt = $pdo->query("SELECT * FROM Parts WHERE id = '" . $_GET['id'] . "'");

$part = $stmt->fetch();

echo "Name: " . $part['name'] . "<br />\n";
echo "Manufacturer: " . $part['manufacturer'] . "<br />\n";
echo "Price: " . $part['price'] . "<br />\n";

就是这样，您应该根据您拥有的表格和模板进行一些调整。

需要注意的是，我使用PDO 机制来进行查询。这是因为mysql_* 函数已被弃用了很长时间，以至于现在它已从 PHP 7.0 中删除。此外，当前的 PHP 版本是 PHP 8。所以，请做好准备，许多网络托管可能会删除旧的 PHP 版本，继续前进。

推荐阅读