Forum Moderators: coopster

Message Too Old, No Replies

Dynamic image table

Dynamic Image table

         

Afterlithe

11:26 pm on Mar 12, 2007 (gmt 0)

10+ Year Member



Hello everyone,
I have a problem that I believe is pretty simple to solve, but I have been beating my head against the wall. What I want to do is just display images from a mysql database into a dynamic table.

For example, I want the images to fill up 5 cells on one row and then create a new row, and so forth until all the images are displayed. I have tried several diffent scripts but with now luck.

The database fields are 'id', and 'image'. The 'image' field just has the image names (like example.jpg), and are linked to images in a folder like this:

<img src="/New/custom_code/e_cards/thumbs/<?php echo $row_list['image'];?>" border="0" />

All I can do so far is use a repeating region that makes a single column line down the page.

Thanks for the help.

eelixduppy

12:25 am on Mar 13, 2007 (gmt 0)



Welcome to WebmasterWorld, Afterlithe!

Here's a quick example of what you want. It uses the modulus operator [us2.php.net], which, once learned, is very good for this sort of thing :)


$i = 0;
$num_of_cols = 5;
echo '<table border="1"><tr>';
while($row = mysql_fetch_array($result)) {
echo ($i!= 0 && $i%$num_of_cols == 0)?'</tr><tr>':''; #used [url=http://us2.php.net/operators.comparison]ternary operator[/url] here
echo '<td>'.$row['col_name'].'</td>';
$i++;
}
echo '</tr></table>';

This is not tested

Good luck! :)

[edited by: eelixduppy at 7:16 pm (utc) on Mar. 13, 2007]

scriptmasterdel

12:36 am on Mar 13, 2007 (gmt 0)

10+ Year Member



Something like this? I have used the "modular arithmetic" to determine when the next line should occur and a few statements to code the table correctly.

echo '<table border="1">';
$getImages = mysql_query("SELECT * FROM images");
$countRows = mysql_num_rows($getImages);
$i = 0;
if ($countRows > 0)
{
while ($rowImages = mysql_fetch_assoc($getImages))
{
if ($i % 4 == 0) echo ($i > 0? '</tr>' : '') . '<tr>';
echo '<td><img src="/New/custom_code/e_cards/thumbs/'.$rowImages['image'].'" border="0" /></td>';
if ($i == $countRows - 1)
echo '</tr>';
$i++;
}
}
echo '</table>';

It's a bit shabby, but i think it should work ok for you.

Let me know how you get on.

Del

[edited by: scriptmasterdel at 12:44 am (utc) on Mar. 13, 2007]

scriptmasterdel

12:37 am on Mar 13, 2007 (gmt 0)

10+ Year Member



You gotta be quick in this place ;-)

Afterlithe

12:53 am on Mar 13, 2007 (gmt 0)

10+ Year Member



Thanks for the quick responses. I will try and incorporate it into my code and see if I can get it working, will probably be posting tomorrow =)

Afterlithe

5:05 pm on Mar 13, 2007 (gmt 0)

10+ Year Member



I get this error when trying the code:

Warning: mysql_num_rows(): supplied argument is not a valid MySQL result resource

I believe its because of the versions of php and mysql I am using on the server. I am using php 4.4.1 and mysql client api version 3.23.58 and not sure how that translates to what server version.

Here is what the page code looks like:

<?php require_once('../../Connections/sealife.php');?>
<?php
echo '<table border="1">';
$getImages = mysql_query("SELECT * FROM e_cards");
$countRows = mysql_num_rows($getImages);
$i = 0;
if ($countRows > 0)
{
while ($rowImages = mysql_fetch_assoc($getImages))
{
if ($i % 4 == 0) echo ($i > 0? '</tr>' : '') . '<tr>';
echo '<td><img src="/New/custom_code/e_cards/thumbs/'.$rowImages['image'].'" border="0" /></td>';
if ($i == $countRows - 1)
echo '</tr>';
$i++;
}
}
echo '</table>';
?>

[edited by: Afterlithe at 5:22 pm (utc) on Mar. 13, 2007]

joelgreen

6:38 pm on Mar 13, 2007 (gmt 0)

10+ Year Member



Maybe mysql_query produces error. I added code in bold for diagnostic.

<?php require_once('../../Connections/sealife.php');?>
<?php
echo '<table border="1">';
$getImages = mysql_query("SELECT * FROM e_cards");
if(!$getImages) die("Cannot execute query. " . mysql_error());
$countRows = mysql_num_rows($getImages);
$i = 0;
if ($countRows > 0)
{
while ($rowImages = mysql_fetch_assoc($getImages))
{
if ($i % 4 == 0) echo ($i > 0? '</tr>' : '') . '<tr>';
echo '<td><img src="/New/custom_code/e_cards/thumbs/'.$rowImages['image'].'" border="0" /></td>';
if ($i == $countRows - 1)
echo '</tr>';
$i++;
}
}
echo '</table>';
?>

Afterlithe

6:47 pm on Mar 13, 2007 (gmt 0)

10+ Year Member



Got it working, thanks for the help. Now I just need to work it a little bit to get the images to be links to a more detailed page, that also displays the selected image depending on the 'id' of the image in the mysql table.

[edited by: Afterlithe at 7:12 pm (utc) on Mar. 13, 2007]

Afterlithe

12:04 am on Mar 14, 2007 (gmt 0)

10+ Year Member



Anyone know how to make the images links?

like: (except I am not sure how to do it in PHP)

<a href="?id=<?php echo $row_list['id'];?>"> </a>

eelixduppy

12:25 am on Mar 15, 2007 (gmt 0)



To link up images you use the following syntax:

<a href="http://www.example.com"><img src="image.jpg" alt="picture!" /></a>

lordbeezdje

9:10 pm on Mar 15, 2007 (gmt 0)

10+ Year Member



if your database list contains all the images in the specified folder, you could use the php filesystem functions to save yourself the time used to keep your database up to date.

This script will read the specified directory (not subdirectories!) and display the images in a table with the specified numer of rows.

<?php

$path = "path/to/images"; // relative to the directory in which this script is saved
$extensions = Array('.gif','.jpg','.png'); // Array with allowable file extensions
$num_cols = 5; // numer of columns to use in table
$img_width = '200'; // sets the standard image width

$images = Array();
if(@$handle = opendir($path)) // tests if the directory exists and is readable
{
while(false!== ($file = readdir($handle)))
{
if($file!= '.' && $file!= '..' &&!is_dir($file) && in_array(substr($file,-4),$extensions)) // ignore this dir pointer, parent dir pointer,
// subdirs and file with wrong extensions
{
$images[] = $file; // enters the image into
}
}
}

echo "<table cellspacing='0' cellpadding='0' border='1'>\n";
echo "<colgroup>\n";
for($i=0;$i<$num_cols;$i++)
{
echo "<col width='".$img_width."' />\n";
}
echo "</colgroup>\n<tr>\n";

if(count($images)>0) // if the images array contains images
{
$i=1; // sets column counter to 1
foreach($images as $image) // runs through image array and makes the cells with images (linked)
{
if($i==$num_cols+1)
{
echo "</tr>\n<tr>\n";
$i=1;
}
echo "<td><a href='location'><img src='$path/$image' border='0' width='$img_width' /></a></td>\n";
$i++;
}
if($i <= $num_cols) // function to fill out remaining cells
{
while($i<=$num_cols)
{
echo "<td>&nbsp;</td>\n";
$i++;
}
}
}
else
{
echo "<td>No images in specified folder</td>\n";
}
echo "</tr>\n</table>\n";

?>

if you set the id you want to link to as the name of the image in your folder, you can exchange <a href='location'> with
<a href='?".substr($file,0,(strlen($file)-4))."'>

I haven't tested this function yet, but it should work.
If your images have very variable widths, then you have to remove the $img_width in the top, and in the <img> tag. You CANNOT set it to '', as html will read is as zero and your images will have a width of zero.