嘗試在php中創建循環引導卡

Question

我在php和mysqli中相當新，並嘗試建立一些基本的網站。

基本上我想在php中做出循環語句以在同一行中創建具有相同大小和顏色的卡片，而無需自己在html中手動創建卡片。

使用bootstrap，php和mysqli

我使用的數據庫包含itemname（varchar），itemprice（varchar）和itemimage（mediumblob）

代碼成功運行，但是輸出與引導卡不匹配，並且它們拒絕位於同一行

誰能幫我？ 謝謝

 <!DOCTYPE html> <html> <head> <title></title> <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="css/style.css"> </head> <body> <div class="container"> <?php require 'dbh.inc.php'; $sql = "SELECT * FROM item"; $stmt = mysqli_stmt_init($conn); if (!mysqli_stmt_prepare($stmt,$sql)) { echo "error"; } else{ mysqli_stmt_execute($stmt); $result = $stmt->get_result(); if ($result->num_rows > 0) { print '<div class="row">'; while ($row = $result->fetch_assoc()) { print' <div class="col-4">'; print' <div class="card">'; print' <img height="250" width="250" class="card-img-top" src="data:image/jpeg;base64,'.base64_encode( $row['itemimage'] ).'">'; print' <div class="card-body">'; print' <h5 class="card-title">'.$row["itemname"].'</h5>'; print' <p class="card-text">Price : '.$row["itemprice"].'</p>'; print' </div>'; print' </div>'; print' </div>'; } } else { print' </div>'; } } $conn->close(); ?> <script src="bootstrap/js/jquery-3.3.1.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="bootstrap/js/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script> <script src="bootstrap/js/bootstrap.min.js" integrity="sha384-7aThvCh9TypR7fIc2HV4O/nFMVCBwyIUKL8XCtKE+8xgCgl/PQGuFsvShjr74PBp" crossorigin="anonymous"></script> </div> </body> </html>

結果

Answer 1

我假設您已經測試過查詢結果中確實有數據。

復制並更新了您的代碼。 一些事情：

您在if()語句的else中關閉div（用於行），但在if()端將其打開。
只要您正確使用<?php或<?= and ?>就可以關閉PHP並在函數/循環中使用純HTML ?>

<?php function createCard(array $row) { ?>
    <div class="col-4">
        <div class="card">
            <img height="250"
                 width="250"
                 class="card-img-top"
                 src="data:image/jpeg;base64,<?= base64_encode($row['itemimage']) ?>">
            <div class="card-body">
                <h5 class="card-title"><?= $row["itemname"] ?></h5>
                <p class="card-text">Price : <?= $row["itemprice"] ?></p>
            </div>
        </div>
    </div>
<?php } ?>

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
    <div class="container">
        <div class="row">
        <?php

        require 'dbh.inc.php';

        $sql  = "SELECT * FROM item";
        $stmt = mysqli_stmt_init($conn);

        if (!mysqli_stmt_prepare($stmt, $sql)) {
            echo "error";
        } else {
            mysqli_stmt_execute($stmt);
            $result = $stmt->get_result();
            if ($result->num_rows > 0) {
                while ($row = $result->fetch_assoc()) {
                    createCard($row);
                }
            }
        }
        $conn->close();
        ?>
        </div>

        <script src="bootstrap/js/jquery-3.3.1.min.js"
                integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
                crossorigin="anonymous"></script>
        <script src="bootstrap/js/popper.min.js"
                integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
                crossorigin="anonymous"></script>
        <script src="bootstrap/js/bootstrap.min.js"
                integrity="sha384-7aThvCh9TypR7fIc2HV4O/nFMVCBwyIUKL8XCtKE+8xgCgl/PQGuFsvShjr74PBp"
                crossorigin="anonymous"></script>
    </div>
</body>
</html>

嘗試在php中創建循環引導卡

問題描述

1 個解決方案

解決方案1
0 已采納 2019-02-27 08:47:46

嘗試在php中創建循環引導卡

問題描述

1 個解決方案

解決方案1 0 已采納 2019-02-27 08:47:46

解決方案1
0 已采納 2019-02-27 08:47:46