how to put products in loop to show all product

This my product list file in php which i try to show list of all products with the help of https://stackoverflow.com/a/48837052/12033292. My category table name is category and product table name is products. I get category name from another page and show all products in this page

Product list
I want to show all products but in output i see only one product in screen.

<?php
include('config.php');
// Upload configs.
define('UPLOAD_DIR', 'uploads');
define('UPLOAD_MAX_FILE_SIZE', 10485760); // 10MB.
//@changed_2018-02-17_14.28
define('UPLOAD_ALLOWED_MIME_TYPES', 'image/jpeg,image/png,image/gif');
define('HOST', 'localhost');
define('PORT', 3306);
define('DATABASE', 'bakery');
define('USERNAME', 'root');
define('PASSWORD', '');
define('CHARSET', 'utf8');
/*
 * Enable internal report functions. This enables the exception handling, 
 * e.g. mysqli will not throw PHP warnings anymore, but mysqli exceptions 
 * (mysqli_sql_exception).
 * 
 * MYSQLI_REPORT_ERROR: Report errors from mysqli function calls.
 * MYSQLI_REPORT_STRICT: Throw a mysqli_sql_exception for errors instead of warnings. 
 * 
 * @link http://php.net/manual/en/class.mysqli-driver.php
 * @link http://php.net/manual/en/mysqli-driver.report-mode.php
 * @link http://php.net/manual/en/mysqli.constants.php
 */
$mysqliDriver = new mysqli_driver();
$mysqliDriver->report_mode = (MYSQLI_REPORT_ERROR | MYSQLI_REPORT_STRICT);
/*
 * Create a new db connection
 * @see http://php.net/manual/en/mysqli.construct.php
 */
$connection = new mysqli(HOST, USERNAME, PASSWORD, DATABASE, PORT);

if (!isset($_GET['category']) || empty($_GET['category']) ) {
    $errors[] = 'You must select a category in order to see its details!';
} else {
    $categoryId = $_GET['category'];

    /*
     * Get the product details.
     */
    $sql = 'SELECT * 
            FROM products 
            WHERE category = ? ';

    $statement = $connection->prepare($sql);

    $statement->bind_param('i', $categoryId);

    $statement->execute();

    /*
     * Get the result set from the prepared statement.
     * 
     * NOTA BENE:
     * Available only with mysqlnd ("MySQL Native Driver")! If this 
     * is not installed, then uncomment "extension=php_mysqli_mysqlnd.dll" in 
     * PHP config file (php.ini) and restart web server (I assume Apache) and 
     * mysql service. Or use the following functions instead:
     * mysqli_stmt::store_result + mysqli_stmt::bind_result + mysqli_stmt::fetch.
     * 
     * @link http://php.net/manual/en/mysqli-stmt.get-result.php
     * @link https://stackoverflow.com/questions/8321096/call-to-undefined-method-mysqli-stmtget-result
     */
    $result = $statement->get_result();

    /*
     * Fetch data (all at once) and save it into an array.
     * 
     * @link http://php.net/manual/en/mysqli-result.fetch-all.php
     */
    $products = $result->fetch_all(MYSQLI_ASSOC);

    /*
     * Free the memory associated with the result. You should 
     * always free your result when it is not needed anymore.
     * 
     * @link http://php.net/manual/en/mysqli-result.free.php
     */
    $result->close();

    $statement->close();

    if (!$products) {
        $errors[] = 'No product found.';
    } else {
        $product = $products[0];
        $productName = $product['title'];
        $productQuantity = $product['price'];
        $productDescription = $product['description'];
         $productSpecification = $product['specification'];
         $productcategory  = $product['category'];
         $productsubcategory = $product['subcategory'];

        /*
         * Get the images list for the provided product.
         */
        $sql = 'SELECT * 
                FROM products_images 
                WHERE product_id = ?';

        $statement = $connection->prepare($sql);

        $statement->bind_param('i', $categoryId);

        $statement->execute();

        $result = $statement->get_result();

        $images = $result->fetch_all(MYSQLI_ASSOC);

        $result->close();

        $statement->close();

        $connection->close();
    }
}
?>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
        <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes" />
        <meta charset="UTF-8" />
        <!-- The above 3 meta tags must come first in the head -->

        <title>Product details</title>

        <script src="https://code.jquery.com/jquery-3.2.1.min.js" type="text/javascript"></script>
        <style type="text/css">
            body {
                padding: 30px;
            }

            .product-details tr td {
                padding: 5px;
            }

            .product-details .label {
                font-weight: 700;
            }

            .product-images {
                margin-top: 30px;
            }

            .product-images tr td {
                padding: 10px;
                font-weight: 700;
                background-color: #eee;
            }

            .product-images .label {
                color: #fff;
                font-weight: 700;
                background-color: #8daf15;
            }

            .product-images img {
                max-width: 400px;
                display: inline-block;
                float: left;
            }
        </style>
    </head>
    <body>

        <div class="page-container">
            <h2>Product details</h2>

            <?php
            if (isset($errors)) {
                echo implode('<br/>', $errors);
                exit();
            }
            ?>

            <table class="product-details">
                <tr>
                    <td class="label">Name</td>
                    <td class="label">Quantity</td>
                    <td class="label">Description</td>
                    <td class="label">Images</td>

                </tr>
                <tr>

                    <td><?php echo $productName; ?></td>

                    <td><?php echo $productQuantity; ?></td>

                    <td><?php echo $productDescription; ?></td>
                <?php
                foreach ($images as $image) {
                    $imageId = $image['id'];
                    $imageFilename = $image['filename'];
                    ?>
                        <td>
                            <img src="admin_4/<?php echo $imageFilename; ?>" alt="" />
                        </td>
                    <?php
                }
                ?>
            </table>
        </div>

    </body>
    </html>

This is my output but i want to show my all products

Answer

If you want to see all your products you need to loop through all of the results you get from your query and echo each of the keys you need.

I didn’t test this code but here an example of how it should work:

   <table class="product-details">
    <tr>
        <td class="label">Name</td>
        <td class="label">Quantity</td>
        <td class="label">Description</td>
        <td class="label">Images</td>

    </tr>
    <?php foreach($products as $product) { ?>
        <tr>
            <td><?php echo $product['title']; ?></td>
            <td><?php echo $product['price']; ?></td>
            <td><?php echo $product['description']; ?></td>
        <?php foreach ($images as $image) {
            $imageId = $image['id'];
            $imageFilename = $image['filename']; ?>
            <td><img src="admin_4/<?php echo $imageFilename; ?>" alt="" /></td>
        <?php } ?>
        </tr>
    <?php } ?>   
</table>