CODEWITHSUNDEEP
phphtmlcssuser-interfacehtml-table
Bluejay
Bluejay

Reputation: 351

HTML - formatting a vertical table

I have a table that looks like this:

HEADER1: data1
HEADER2: data2
HEADER3: data3
HEADER4: data4
HEADER5: data5
HEADER6: data6
HEADER7: data7
HEADER8: data8

and so on. I want to set a certain "threshold", say 4, after which the data will switch to looking like this (so that the user doesn't have to scroll down too much):

HEADER1: data1      HEADER5: data5
HEADER2: data2      HEADER6: data6
HEADER3: data3      HEADER7: data7
HEADER4: data4      HEADER8: data8

How do I do such a thing in the simplest possible way?

Here is the current PHP code I use to generate this table:

foreach($row as $key=>$value) {
    echo '<tr>';
    echo '<th>', $headerindeces[$i], "</th>";
    echo '<td>',$value,'</td>';
    echo '</tr>';
    $i++;
}

Upvotes: 1

Views: 67

Answers (1)

andreas
andreas

Reputation: 16936

A very simple approach would be to build another table each time when the threshold is reached (assuming it is ok for you to hardcode the threshold). You can achieve that with the modulus division:

$threshold = 4;
$i = 0;
foreach ($row as $key => $value) {
    if (($i+1) % $threshold == 0) {
        echo '</table><table>';
    }
    echo '<tr>';
    echo '<th>', $headerindeces[$i], "</th>";
    echo '<td>', $value, '</td>';
    echo '</tr>';
    $i++;
}

And after that, just use CSS to display the two tables next to each other.

Upvotes: 1

Related Questions