Display data from database table into a html table using php

Question

I have a table named Produit in my database "enchere".

I would like to display data stored in the table produit. these data are Nom_produit, description_produit and the image of the product.

the image is stored in a server ( in my machine, I am testing my code with Xampp).

I get all the data and are displayed. The problem is the image can not be displayed. I tried to make sure that the URL of the image is correctly typed and I could'nt fix the probelem. Any help please A screenshot of my web page is attached , no image displayed below is my code .

$conn=new mysqli('localhost','root','','enchere');
if (!$conn) {
    die ('Failed to connect to MySQL: ' . mysqli_connect_error());  
}

$sql = "select * from produit ";

$query = mysqli_query($conn, $sql);

if (!$query) {
    die ('SQL Error: ' . mysqli_error($conn));
}
//$row = mysqli_fetch_array($query);
//echo "127.0.0.1/images/".$row['image'];
?>
<html>
<head>
    <title>Displaying MySQL Data in HTML Table</title>
    <style type="text/css">
        body {
            font-size: 15px;
            color: #343d44;
            font-family: "segoe-ui", "open-sans", tahoma, arial;
            padding: 0;
            margin: 0;
        }
        table {
            margin: auto;
            font-family: "Lucida Sans Unicode", "Lucida Grande", "Segoe Ui";
            font-size: 12px;
        }

        h1 {
            margin: 25px auto 0;
            text-align: center;
            text-transform: uppercase;
            font-size: 17px;
        }

        table td {
            transition: all .5s;
        }

        /* Table */
        .data-table {
            border-collapse: collapse;
            font-size: 14px;
            min-width: 537px;
        }

        .data-table th, 
        .data-table td {
            border: 1px solid #e1edff;
            padding: 7px 17px;
        }
        .data-table caption {
            margin: 7px;
        }

        /* Table Header */
        .data-table thead th {
            background-color: #508abb;
            color: #FFFFFF;
            border-color: #6ea1cc !important;
            text-transform: uppercase;
        }

        /* Table Body */
        .data-table tbody td {
            color: #353535;
        }
        .data-table tbody td:first-child,
        .data-table tbody td:nth-child(4),
        .data-table tbody td:last-child {
            text-align: right;
        }

        .data-table tbody tr:nth-child(odd) td {
            background-color: #f4fbff;
        }
        .data-table tbody tr:hover td {
            background-color: #ffffa2;
            border-color: #ffff0f;
        }

        /* Table Footer */
        .data-table tfoot th {
            background-color: #e5f5ff;
            text-align: right;
        }
        .data-table tfoot th:first-child {
            text-align: left;
        }
        .data-table tbody td:empty
        {
            background-color: #ffcccc;
        }
    </style>
</head>
<body>
    <h1>VALIDATION DES PRODUITS AJOUTES</h1>
    <table class="data-table">
        <caption class="title">Produit en attente Validation administrateur</caption>
        <thead>
            <tr>
                <th>Nom_Produit</th>
                <th>Description_Produit</th>
                <th>Prix_Produit</th>
                <th>Image_Produit</th>
            </tr>
        </thead>
        <tbody>
        <?php

        while ($row = mysqli_fetch_array($query))
        {
            //$amount  = $row['amount'] == 0 ? '' : number_format($row['amount']);
            echo '<tr>

                    <td>'.$row['nom'].'</td>
                    <td>'.$row['description'].'</td>
                    <td>'.$row['prix'].'</td>
                    <td>'.'<img src='."127.0.0.1/images/".$row['image']." width=100 height=100";'/></td>

                </tr>';
        }?>
        </tbody>
    </table>
</body>
</html>

"I get all the data and are displayed.The problem is the image can not be displayed" is the image link from the DB correct? Is the image in the correct location? what does this output var_dump($row['image']);? Does the "image" field exist in the table? — James
– James, Commented Apr 9, 2018 at 22:39
The OP has messed up concatenation here... As you can see, he switches between single and double quotations, and thus there is an issue with that last <td> cell... Also, the image link isn't relative. <td>'.'<img src='."127.0.0.1/images/".$row['image']." width=100 height=100";'/></td> — Nerdi.org
– Nerdi.org, Commented Apr 9, 2018 at 22:47

Nerdi.org · Accepted Answer · 2018-04-09 22:44:55Z

1

<?php
while ($row = mysqli_fetch_array($query)){
   //$amount  = $row['amount'] == 0 ? '' : number_format($row['amount']);
   echo '<tr>
   <td>'.$row['nom'].'</td>
   <td>'.$row['description'].'</td>
   <td>'.$row['prix'].'</td>
   <td><img src="/images/'. $row['image'] . '" width="100" height="100"/></td>
   </tr>';
 }
?>

Your image path should be relative, not with 127.0.0.1 on it! You can try src="images/" also if the slack in front messes up. You can also do things like $_SERVER['HTTP_HOST'] to get the host name for the URL instead of using an IP like 127.0.0.1 :)

The other issue I detected was a problem with the concatenation of your $row['image'] value... You messed up the ' and " symbols around there, so that may be why it's not showing up at all. Either way, I believe my code above fixes your issue!

answered Apr 9, 2018 at 22:44

Nerdi.org

9336 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Display data from database table into a html table using php

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related