Add image according to 4 returned records in php

Question

I need to add an image (saved path in mysql - image from file on server) to my page according to 4 rows returned. There will always be 4 rows returned from db.

My problem is that it shows the same image (main with 3 thumbnails) in all 4 image holders. I've used the following to add the images ...

First my php function -

//Get all images within a specific album...
function get_images($vehicleid) {
    //$vehicle_id = (int)$vehicle_id;

    $images = array();

    $image_query = mysql_query("SELECT * FROM `images` WHERE `images`.`vehicle_id`='$vehicleid'");

    $result = $image_query;

    if (!$result){
       echo 'Error in loading vehicle adverts. Please refresh page and try again';
       exit();
    }

    while($images_row = mysql_fetch_assoc($image_query)) {
        $images[] = array(
            'imageid' => $images_row['image_id'],
            'branch' => $images_row['branch'],
            'vehicleid' => $images_row['vehicle_id'],
            'timestamp' => $images_row['timestamp'],
            'ext' => $images_row['ext'],
            'imagenum' => $images_row['imagenum']
        );

        //This returns main image and 3 thumbs, but only image from first record is returned..
                     return $images;
    }
        //return $images;
                    //When runned from here, main image is from 1st, then 2nd, 3rd etc row returned, but it loads each rows image as a main and the thumbs the same image...
}

The code I have used to load the images is as follow ...

<?php
    //Get images...
$images = get_images($vehicleid);

if (empty($images)) {
    ?>

    <table id="thumbnails">
        <tr>
            <td>                                        
                <div>
                <a href="testdrive.php" style="text-decoration:none"><img src="uploads/noimage.jpg" width="600px" height="400px" title="Sorry, No Image Available Yet" /></a>
                </div>                    
            </td>
            <td>
                <table width="350px">
                    <tr height="50px">
                    </tr>
                    <tr>
                        <td>
                            <div id="mainimages" align="center" style="font-size:14px">
                                <?php echo $year, ' ', $manufacturer, ' ', $modelrange, ' ', $modelder, '.', '<br />', '<br />', 'This beautiful ', $colour, ' ',$manufacturer, ' only has ', $mileage, ' kilometres  with a service history and is selling for ', '<strong>ONLY R ', $price, '. </strong>', '<br />', '<br />', 'It features ', $comments, '<br />', '<br />', 'This vehicle is available NOW from our ', '<a href="testdrive.php" style="text-decoration:none">', 'Tata - ', $branch, ' branch.</a>'; ?> 
                            </div>
                        </td>
                    </tr>

                    <tr>
                        <td>
                            <div id="mainimages" align="center" style="font-size:14px">
                                 <?php //MAIN IMAGE HERE FROM RECORD 1 (Note from upload folder, not thumbs as below)...
                                 echo '<a href="delete_image.php?vehicle_id='.$vehicleid.'"><img src="images/delete.png" title="Delete Advert" /></a>'; 
                                 ?>
                            </div>
                        </td>
                    </tr>
                </table>
            </td>
            </tr>
            <tr>
            <td>
                <img src="uploads/thumbs/noimage.jpg" title="Sorry, No Image Available Yet" width="100px" height="100px" /><img src="uploads/thumbs/noimage.jpg" title="Sorry, No Image Available Yet" width="100px" height="100px" /><img src="uploads/thumbs/noimage.jpg" title="Sorry, No Image Available Yet" width="100px" height="100px" />

                <p style="height:10px"></p>
            </td>
        </tr>
    </table>

    <?php
        //echo '<img src="uploads/noimage.jpg" />';
        } else {
            //Display images thumbs...
            foreach ($images as $image) {
    ?>

    <table id="thumbnails">
        <tr>
            <td>
                <?php 
                    //Add image title to the right of main image...
                    echo '<a href="testdrive.php" style="text-decoration:none"><img src="uploads/', $image['vehicleid'], '/', $image['imageid'], '.', $image['ext'], '" title="Uploaded ', date('D M Y / h:i', $image['timestamp']), ' - ', $year, ' ', $manufacturer, ' ', $modelrange, ' ', $modelder, '.', 'This beautiful ', $colour, ' ',$manufacturer, ' only has ', $mileage, ' kilometres and is selling for ', 'ONLY R ', $price, '.', '" width="600px" height="400px" /></a>'; 
                ?>
                </div>
            </td>
            <td>
                <table width="350px">
                    <tr height="50px">
                    </tr>
                    <tr>
                        <td>
                            <div id="mainimages" align="center" style="font-size:14px">
                                <?php 
                                echo $year, ' ', $manufacturer, ' ', $modelrange, ' ', $modelder, '.', '<br />', '<br />', 'This beautiful ', $colour, ' ',$manufacturer, ' only has ', $mileage, ' kilometres with a service history and is selling for ', '<strong>ONLY R ', $price, '. </strong>', '<br />', '<br />', 'It features ', $comments, '<br />', '<br />', 'This vehicle is available NOW from our ', '<a href="testdrive.php" style="text-decoration:none">', 'Tata - ', $branch, ' branch.</a>'; 
                                ?> 
                            </div>
                        </td>
                    </tr>

                    <tr>
                        <td>
                            <div id="mainimages" align="center" style="font-size:14px">
                                 <?php
                                 echo '<a href="delete_image.php?vehicle_id='.$vehicleid.'"><img src="images/delete.png" title="Delete Advert" /></a>'; 
                                 ?>
                            </div>
                        </td>
                    </tr>
                </table>
            </td>
            </tr>
            <tr>
            <td>
                <?php //THIS WHERE I NEED TO START LOADING THE CORRECT IMAGES - THIS SHOULD BE IMAGE RETURNED FROM RECORD 2...
                echo '<a href="testdrive.php" style="text-decoration:none"><img src="uploads/thumbs/', $image['vehicleid'], '/', $image['imageid'], '.', $image['ext'], '" title="Uploaded ', date('D M Y / h:i', $image['timestamp']), ' - ', $year, ' ', $manufacturer, ' ', $modelrange, ' ', $modelder, '.', 'This beautiful ', $colour, ' ',$manufacturer, ' only has ', $mileage, ' kilometres and is selling for ', 'ONLY R ', $price, '.', '" onclick="showImage("uploads/', $image['vehicleid'], '/', $image['imageid'], '.', $image['ext'], '" width="100px" height="100px")" /></a>';

    //THIS SHOULD BE IMAGE RETURNED FROM RECORD 3...
                echo '<a href="testdrive.php" style="text-decoration:none"><img src="uploads/thumbs/', $image['vehicleid'], '/', $image['imageid'], '.', $image['ext'], '" title="Uploaded ', date('D M Y / h:i', $image['timestamp']), ' - ', $year, ' ', $manufacturer, ' ', $modelrange, ' ', $modelder, '.', 'This beautiful ', $colour, ' ',$manufacturer, ' only has ', $mileage, ' kilometres and is selling for ', 'ONLY R ', $price, '.', '" onclick="showImage("uploads/', $image['vehicleid'], '/', $image['imageid'], '.', $image['ext'], '" width="100px" height="100px")" /></a>';

    //THIS SHOULD BE IMAGE RETURNED FROM RECORD 4...
                echo '<a href="testdrive.php" style="text-decoration:none"><img src="uploads/thumbs/', $image['vehicleid'], '/', $image['imageid'], '.', $image['ext'], '" title="Uploaded ', date('D M Y / h:i', $image['timestamp']), ' - ', $year, ' ', $manufacturer, ' ', $modelrange, ' ', $modelder, '.', 'This beautiful ', $colour, ' ',$manufacturer, ' only has ', $mileage, ' kilometres and is selling for ', 'ONLY R ', $price, '.', '" onclick="showImage("uploads/', $image['vehicleid'], '/', $image['imageid'], '.', $image['ext'], '" width="100px" height="100px")" /></a>';
                ?>

                <p style="height:10px"></p>
            </td>
        </tr>
    </table>

    <?php
            }
        }
    }
   ?>

Anyone have any idea how I can return the correct images to their respective html holders?

Thanx guys.

Answer 1

My previous answer is not correct, but still valid because you never use "imagenum". And return still must be outside the while.

Anyway the reason you get always the same image is that you're using always the same array element.

Try:

$i=0;
foreach ($images as $image) {
    If($i=0) { 
?>

<table id="thumbnails">
    <tr>
        <td>
            <?php 
                //Add image title to the right of main image...
                echo '<a href="testdrive.php" style="text-decoration:none"><img src="uploads/', $image['vehicleid'], '/', $image['imageid'], '.', $image['ext'], '" title="Uploaded ', date('D M Y / h:i', $image['timestamp']), ' - ', $year, ' ', $manufacturer, ' ', $modelrange, ' ', $modelder, '.', 'This beautiful ', $colour, ' ',$manufacturer, ' only has ', $mileage, ' kilometres and is selling for ', 'ONLY R ', $price, '.', '" width="600px" height="400px" /></a>'; 
            ?>
            </div>
        </td>
        <td>
            <table width="350px">
                <tr height="50px">
                </tr>
                <tr>
                    <td>
                        <div id="mainimages" align="center" style="font-size:14px">
                            <?php 
                            echo $year, ' ', $manufacturer, ' ', $modelrange, ' ', $modelder, '.', '<br />', '<br />', 'This beautiful ', $colour, ' ',$manufacturer, ' only has ', $mileage, ' kilometres with a service history and is selling for ', '<strong>ONLY R ', $price, '. </strong>', '<br />', '<br />', 'It features ', $comments, '<br />', '<br />', 'This vehicle is available NOW from our ', '<a href="testdrive.php" style="text-decoration:none">', 'Tata - ', $branch, ' branch.</a>'; 
                            ?> 
                        </div>
                    </td>
                </tr>

                <tr>
                    <td>
                        <div id="mainimages" align="center" style="font-size:14px">
                             <?php
                             echo '<a href="delete_image.php?vehicle_id='.$vehicleid.'"><img src="images/delete.png" title="Delete Advert" /></a>'; 
                             ?>
                        </div>
                    </td>
                </tr>
            </table>
        </td>
        </tr>
        <tr>
        <td>
            <?php $i=1; } else {//THIS WHERE I NEED TO START LOADING THE CORRECT IMAGES - THIS SHOULD BE IMAGE RETURNED FROM RECORD 2...
            echo '<a href="testdrive.php" style="text-decoration:none"><img src="uploads/thumbs/', $image['vehicleid'], '/', $image['imageid'], '.', $image['ext'], '" title="Uploaded ', date('D M Y / h:i', $image['timestamp']), ' - ', $year, ' ', $manufacturer, ' ', $modelrange, ' ', $modelder, '.', 'This beautiful ', $colour, ' ',$manufacturer, ' only has ', $mileage, ' kilometres and is selling for ', 'ONLY R ', $price, '.', '" onclick="showImage("uploads/', $image['vehicleid'], '/', $image['imageid'], '.', $image['ext'], '" width="100px" height="100px")" /></a>';

            ?>



<?php
        }
    }
}
?>
            <p style="height:10px"></p>
        </td>
    </tr>
</table>

Or something similar (it's difficult to write code in the stackoverflow editor).

Answer 2

return $images; must be outside the while or the cycle never will be completed.

I suppose the code doesn't work because there's an error in the DB or in the design of the data. For example, what "imagenum" means in the DB? Should you use this value for retrieve the image?