Dynamic Tables
Possibly one of the easiest things in PHP to do is to dynamically populate a table. We’ve got information that is pulled from a data source (database, directory, whatever) and now we want to create a table that is dynamic, that is, a table that grabs its data on the fly, dynamically. But we just want to specify the number of columns and let PHP do the work. I’ll step you through how to do it and go over what it does. I’ll use a script that I created which indexes pictures–if you need help customizing the script, just drop me a PM via the PHPBuilder forums. My tag on PHPBuilder is bpat1434.
Here’s what we’ll be creating:
I’ll just give you the code that I’m using and focus on the table creation as that is the main point of this tutorial:
$num_of_images = 52;
$title = “Halloweenfetst – 2003: October 31, 2003 – New Jersey”;
$vlink = “#009900”;
$alink = “#006600”;
$link = “#0066CC”;
$text = “#FFFFFF”;
$bgColor = “#006699”;
$month_image_path = ‘./images/thumbs/2003halloweenFest’;
$up_one_level = ‘../index.html’;
$month_path = ‘./imageLoader?’;
echo ‘<html>
<title>’.$title.'</title>
<body bgcolor=”‘.$bgColor.'” vlink=”‘.$vlink.'” alink=”‘.$alink.'” link=”‘.$link.'”>
<p align=”center”>
<a href=”‘.$up_one_level.'”><font face=”Webdings” color=”‘.$text.'”>1<font></a>
</p>
That sets everything up for us. Now, we’ll work with the images and display them in table format.
So we begin with our table and our table row tags:
<table>
<tr>’;
ALL THE CODE IN THE NEXT TWO STEPS WILL GO HERE!!
echo ‘</tr>
</table>’;
So we’ve got our table and a row, but we still need to add our images to the table. We want to show five images across each row, in as many rows as we need to display them. Since we know the number of images we have, let’s create a for() loop, and put it inside of the table row tags from above.:
for($x=1; $x<=$num_of_images; $x++)
{
}
That line says we’re going to increment $x by 1 each time we go through the loop. And, we’ll go through it until $x is equal to, but not greater than, the $num_of_images variable we set (52). So we’re going through the loop 52 times. We still need to add the images to the table, so we add this inside our for loop:
echo ‘<td><a href=”‘.$month_path.’img=’.check($x).’.jpg”>
<img border=”0″ src=”‘.$month_image_path.check($x).’.jpg”></a></td>’;
Now we get all 52 images in one row. Not what we want, but close. Now, how can we make it so that every 5th picture ends the row, and starts a new one? We are going to use the Modulus arithmetic operand (in other words, we’re looking to see what the remainder of a division is). The operand sign is the percent sign (%). So we set up our if() statement thusly:
if($x % 5 == 0)
{
echo ‘</tr>
<tr>’;
}
At this point, our code should look like this:
$num_of_images = 52;
$title = “Halloweenfetst – 2003: October 31, 2003 – New Jersey”;
$vlink = “#009900”;
$alink = “#006600”;
$link = “#0066CC”;
$text = “#FFFFFF”;
$bgColor = “#006699”;
$month_image_path = ‘./images/thumbs/2003halloweenFest’;
$up_one_level = ‘../index.html’;
$month_path = ‘./imageLoader?’;
echo ‘<html>
<title>’.$title.'</title>
<body bgcolor=”‘.$bgColor.'” vlink=”‘.$vlink.'” alink=”‘.$alink.'” link=”‘.$link.'”>
<p align=”center”>
<a href=”‘.$up_one_level.'”><font face=”Webdings” color=”‘.$text.'”>1<font></a>
</p>
<table>
<tr>’;
for($x=1; $x<=$num_of_images; $x++)
{
echo ‘<td><a href=”‘.$month_path.’img=’.check($x).’.jpg”>
<img border=”0″ src=”‘.$month_image_path.check($x).’.jpg”></a></td>’;
if($x % 5 == 0)
{
echo ‘</tr>
<tr>’;
}
}
echo ‘</tr>
</table>’;
That’s all there is to it. With that our code is complete and the photo gallery should be working perfectly. As always, if you run into problems, feel free to post questions about it here, or contact me directly. See you next time!
