Search code examples
phpdynamichtml-tabledynamic-datadynamic-tables

Creating a dynamic table with PHP


I'm trying to make a dynamic table with PHP. I have a page which displays all the pictures from a database. I need the table to be of 5 columns only. If more than 5 pictures are returned, it should create a new row and the displaying of the rest of the pics would continue.

Can anyone please help?

Codes go here: Code in the main page:-

    <table>
    <?php
        $all_pics_rs=get_all_pics();
        while($pic_info=mysql_fetch_array($all_pics_rs)){
        echo "<td><img src='".$pic_info['picture']."' height='300px' width='400px' /></td>";
            } 
?>
</table>

The get_all_pics() function:

$all_pics_q="SELECT * FROM pics";
        $all_pics_rs=mysql_query($all_pics_q,$connection1);
        if(!$all_pics_rs){
            die("Database query failed: ".mysql_error());
        }
        return $all_pics_rs;

This code is creating a single row. I can't think of how I can get multiple rows ... !!


Solution

  • $maxcols = 5;
    $i = 0;
    
    //Open the table and its first row
    echo "<table>";
    echo "<tr>";
    while ($image = mysql_fetch_assoc($images_rs)) {
    
        if ($i == $maxcols) {
            $i = 0;
            echo "</tr><tr>";
        }
    
        echo "<td><img src=\"" . $image['src'] . "\" /></td>";
    
        $i++;
    
    }
    
    //Add empty <td>'s to even up the amount of cells in a row:
    while ($i <= $maxcols) {
        echo "<td>&nbsp;</td>";
        $i++;
    }
    
    //Close the table row and the table
    echo "</tr>";
    echo "</table>";
    

    I haven't tested it yet but my wild guess is something like that. Just cycle through your dataset with the images and as long as you didn't make 5 <td>'s yet, add one. Once you reach 5, close the row and create a new row.

    This script is supposed to give you something like the following. It obviously depends on how many images you have and I assumed that 5 (defined it in $maxcols) was the maximum number of images you want to display in a row.

    <table>
        <tr>
            <td><img src="image1.jpg" /></td>
            <td><img src="image1.jpg" /></td>
            <td><img src="image1.jpg" /></td>
            <td><img src="image1.jpg" /></td>
            <td><img src="image1.jpg" /></td>
        </tr>
        <tr>
            <td><img src="image1.jpg" /></td>
            <td><img src="image1.jpg" /></td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;<td>
        </tr>
    </table>