Loading images into website using MySQL

#1

Hi,
I used these codes to load images into the page but it shows nothing, no errors.

<?php
require "../app/core/database.php";
$sql = "SELECT * FROM images";
$result = $connection->query($sql);
?>
<div class="full-screen-portfolio" id="portfolio">
        <div class="container-fluid">
            <div class="col-md-4 col-sm-6">
                <div class="portfolio-item">
                <?php while($row = $result->fetch_assoc()) {?>
                    <a href="../public/assets/img/".<?php echo $row['image'] ?> data-lightbox="image-1"><div class="thumb">
                    <?php } ?>
                        <div class="hover-effect">
                            <div class="hover-content">
                                <h1>Biodiesel <em>squid</em></h1>
                                <p>Awesome Subtittle Goes Here</p>
                            </div>
                        </div>
                        <div class="image">
                        <?php while($row = $result->fetch_assoc()) {?>
                            <img src="../public/assets/img/".<?php echo $row['image'] ?>>
                            <?php } ?>
                        </div>
                    </div></a>
                </div>
            </div>
        </div>
    </div>

What is wrong with this code?

#2

What error are you getting?

1 Like
#3

The page loads correctly. There is no error, and of course, no image loaded.

#4

I have saved image file name and its extension in MySQL and the corresponding file exists in the defined folder.

#5

Well, perhaps there is no images in your database table. Here are some DEBUG ideas for you to start.
First, is this a local server or remote live server? If local, like Wamp, you can just check your LOGS folder under the Wamp64/logs folder and review your errors there. Erase all of them and then run your page and review the new ones there. (They accumulate) If on a remote live server, you can log into your control panel on the server and select the logs option to review them.

Next, you can add two lines to your page that will turn on your error display options in PHP like this:

error_reporting(E_ALL);
ini_set('display_errors', TRUE);

Run your page and see if you get errors. Remember some errors will not display if the HTML is badly formatted, so you might need to view the live results. To do that, you can RIGHT-CLICK on your page once it fails. Select VIEW-SOURCE. This will open another in your browser and you can review the output of your server. REMEMBER**** PHP does not show in the browser, but, you can see if the output is nicely formatted and what is missing.

Another issue can be the formatting of folder pointers for the images. You show …/public/assets/img/image-name.
This may be incorrect. It means you back up one folder from the current one, then go down to public folder and then into the assets folder and then the img folder to get the filename. I suspect that is not correct.

Well, there you go, all you need to know about DEBUGGING… Hope it helps you solve it!

#6

When I put echo $result[‘image’] out of the html tag, it shows my filename. There is something wrong with html tag concatenation.

#7

Looking at your code above, you used $row[] which doesn’t matter. Most programmers use either $row[] or $results[].

Okay, at least you are making headway. In your ROOT of your server, do you have a folder named public?
If yes, then remove the … before it.

#8

Yes, I have two folders, public, and app.
I changed Html section to something like this:

<div class="full-screen-portfolio" id="portfolio">
        <div class="container-fluid">
            <div class="col-md-4 col-sm-6">
                <div class="portfolio-item">
                <?php while($row = $result->fetch_assoc()) {?>
                    <a href="/public/assets/img/<?php echo $result['image']?>" data-lightbox="image-1"><div class="thumb">
                        <div class="hover-effect">
                            <div class="hover-content">
                                <h1>Biodiesel <em>squid</em></h1>
                                <p>Awesome Subtittle Goes Here</p>
                            </div>
                        </div>
                        <div class="image">
                            <img src="/public/assets/img/<?php echo $result['image']?>">
                            <?php } ?>
                        </div>
                    </div></a>
                </div>
            </div>
        </div>
    </div>

This time, it caused my head buttons to stop working.

#9

There is nothing bad with … because when I use file name as a simple text it shows my image. The path is correct. There is a problem with Html+php code.

#10

Very sorry, my mistake! You can not use forward slashes as they are special chars.
Try “\public\assets\img”…

#11

You can also short tag it.

<img src="\public\assets\img\<?= $result['image'] ?>" <?= getimagesize($result['image])[3] ?>>

The last part doesn’t need to be there and if doesn’t work take it out. :thinking::wink:

#12

Final changes which solved the problem:

<?php while ($row = $result->fetch_assoc()) { ?>

    <div class="full-screen-portfolio" id="portfolio">

      <div class="container-fluid">

        <div class="col-md-4 col-sm-6">

          <div class="portfolio-item">

            <a href="../public/assets/img/<?php echo $row['image'] ?>" data-lightbox="image-1">

              <div class="thumb">

                <div class="hover-effect">

                  <div class="hover-content">

                    <h1>Biodiesel <em>squid</em></h1>

                    <p>Awesome Subtittle Goes Here</p>

                  </div>

                </div>

                <div class="image">

                  <img src="../public/assets/img/<?php echo $row['image'] ?>">

                </div>

              </div>

            </a>

          </div>

        </div>

      </div>

    </div>

  <?php } ?>
#13

Nice! Lack of sleep made me mistype. Glad Strider jumped in and help fix that.

Glad you got it working!

Sponsor our Newsletter | Privacy Policy | Terms of Service