Limited column html table

E

Eiffelmtl

New member
Hello,

I got a script who display list of data from a db


Code: 
<?php
                    require_once "include/config.php";
    $mysqli = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME);   
    if ($mysqli->errno) {
        print $mysqli->error;
        exit();
    }
    
    // 3 most recent albums only
    $album_sql = "SELECT * FROM Albums ORDER BY date_created DESC;";
    $album_result = $mysqli->query($album_sql);
    
    // 6 most recent images only
    $image_sql = "SELECT * FROM Images ORDER BY date_modified DESC;";
    $image_result = $mysqli->query($image_sql);
    
    
    
    if (!$album_result) {
        print($mysqli->error);
        exit();
    }
    
    if (!$image_result) {
        print($mysqli->error);
        exit();
    }

                    while ($row = $album_result->fetch_assoc()) {
                        $album_id = $row['album_id'];
                        $background = $row['cover_file'];
                        $title = $row['title'];
                        $description = $row['description'];
                        $date = $row['date_created'];

                        $image_count = "SELECT * FROM ImagesinAlbums WHERE album_id =  '".$album_id."';";
                        $image_count_result = $mysqli->query($image_count);
    
                        if ($image_count_result) {

                            // Return the number of rows in result set
                            $rowcount = mysqli_num_rows( $image_count_result );
    
                        }

                        if($language == "en") {
                            print("<a href='view-album.php?albumid=$album_id&language=en'>");

                        } else {
                            print("<a href='view-album.php?albumid=$album_id&language=fr'>");;
                        }
                        // Inline CSS because dynamically generated; styling does not work otherwise
                        print("<div class='divTable'><div class='divTableBody'><div class='divTableRow'><div class='divTableCell'><img class='albumCover' src='images/album/$background' width='200px' style='width:200px'></div></div>");
                        print("<div class='divTableRow'><div class='divTableCell'><div class='galleri_caption'><p>$title<br>$rowcount image(s)</p></div></div></div></div></div>");

                        }
                ?>

But I want those data to be display in max 3 column. I am enable but only with one data with array_chunk.


Code: 
<?php
    require_once "include/config.php";
    $conn = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME);
 
 

$result = $conn->query("SELECT * FROM Albums");
while ($row = $result->fetch_array()) {
    $rows[] = $row;
}         

$lists = array_chunk($row, ceil(count($row) / 3));


// You can replace this $column with $grid or $row depending on your use case.
echo '<table border="0">';
foreach ($lists as $column) {
    echo '<tr>';
        foreach ($column as $row) {                     
            echo '<td><img src="images/album/'.$row.'" width=150px></td>';
        }
        echo '</tr>';
}
echo '</table>';
?>

Any help will be pleased. Thanks
 
Eiffelmtl said:
Hello,

I got a script who display list of data from a db


Code: 
<?php
                    require_once "include/config.php";
    $mysqli = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME);  
    if ($mysqli->errno) {
        print $mysqli->error;
        exit();
    }
   
    // 3 most recent albums only
    $album_sql = "SELECT * FROM Albums ORDER BY date_created DESC;";
    $album_result = $mysqli->query($album_sql);
   
    // 6 most recent images only
    $image_sql = "SELECT * FROM Images ORDER BY date_modified DESC;";
    $image_result = $mysqli->query($image_sql);
   
   
   
    if (!$album_result) {
        print($mysqli->error);
        exit();
    }
   
    if (!$image_result) {
        print($mysqli->error);
        exit();
    }

                    while ($row = $album_result->fetch_assoc()) {
                        $album_id = $row['album_id'];
                        $background = $row['cover_file'];
                        $title = $row['title'];
                        $description = $row['description'];
                        $date = $row['date_created'];

                        $image_count = "SELECT * FROM ImagesinAlbums WHERE album_id =  '".$album_id."';";
                        $image_count_result = $mysqli->query($image_count);
   
                        if ($image_count_result) {

                            // Return the number of rows in result set
                            $rowcount = mysqli_num_rows( $image_count_result );
   
                        }

                        if($language == "en") {
                            print("<a href='view-album.php?albumid=$album_id&language=en'>");

                        } else {
                            print("<a href='view-album.php?albumid=$album_id&language=fr'>");;
                        }
                        // Inline CSS because dynamically generated; styling does not work otherwise
                        print("<div class='divTable'><div class='divTableBody'><div class='divTableRow'><div class='divTableCell'><img class='albumCover' src='images/album/$background' width='200px' style='width:200px'></div></div>");
                        print("<div class='divTableRow'><div class='divTableCell'><div class='galleri_caption'><p>$title<br>$rowcount image(s)</p></div></div></div></div></div>");

                        }
                ?>

But I want those data to be display in max 3 column. I am enable but only with one data with array_chunk.


Code: 
<?php
    require_once "include/config.php";
    $conn = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME);
 
 

$result = $conn->query("SELECT * FROM Albums");
while ($row = $result->fetch_array()) {
    $rows[] = $row;
}        

$lists = array_chunk($row, ceil(count($row) / 3));


// You can replace this $column with $grid or $row depending on your use case.
echo '<table border="0">';
foreach ($lists as $column) {
    echo '<tr>';
        foreach ($column as $row) {                    
            echo '<td><img src="images/album/'.$row.'" width=150px></td>';
        }
        echo '</tr>';
}
echo '</table>';
?>

Any help will be pleased. Thanks
Click to expand...
The foreach loop for $lists creates a new row for each column, which results in all album covers being displayed in a single row instead of three separate columns.
Instead of creating a new row for each column, you should create a new cell for each album cover within a single row.
 
Moorcam said:
The foreach loop for $lists creates a new row for each column, which results in all album covers being displayed in a single row instead of three separate columns.
Instead of creating a new row for each column, you should create a new cell for each album cover within a single row.
Click to expand...
Show me how to do that. I am not an expert.

Thank
 
Eiffelmtl said:
Show me how to do that. I am not an expert.

Thank
Click to expand...
Replace your current code with this:
Code: 
<?php
require_once "include/config.php";

$conn = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME);

// Check for connection errors
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

$result = $conn->query("SELECT * FROM Albums");
$rows = [];

if ($result) {
    while ($row = $result->fetch_assoc()) {
        $rows[] = $row;
    }
}

// Split the rows into three columns
$lists = array_chunk($rows, ceil(count($rows) / 3));

// Display the albums in a table format
echo '<table border="0"><tr>'; // Start a single row for all columns
foreach ($lists as $column) {
    foreach ($column as $row) {
        echo '<td><img src="images/album/' . htmlspecialchars($row['image']) . '" width="150px" alt="Album Cover"></td>';
    }
}
echo '</tr></table>'; // Close the single row

//$conn->close(); - No Need to close the connection. PHP does this automatically.
?>
 
You must log in or register to reply here.
Back
Top