Search code examples
phpformattinghtml-table

Dynamically generate table using PHP


I know this has been asked before and I have got it working using the following code:

<?php
$maxcols = 8;  $i = 0;
echo "<table id='table1'><tr>";

foreach ($id as $k => $v) {
    echo "<td id='0'><div id='{$k}' class='drag t1'>{$v}</div></td>"; $i++;
    if ($i == $maxcols) { $i = 0; echo "</tr><tr>"; }
} $i++;


while ($i <= $maxcols) {
    $i++; echo "<td></td>";
}

echo "</tr></table>";
?>

This results in a table that looks like this :

enter image description here

I'd like to add headers to this so the end result looks like this:

enter image description here

I'd like to do it dynamically so if I create a table that is only 5 columns wide I'd get on the first header row ID01 - ID05 and on the second header row ID06 - ID10

I want to limit the header ID values to be no more than $maxid any extra header fields should be blank, like this : If $maxid = 12; then :

enter image description here

I need the header rows are made as follows and not using <TH>

<td class="mark">

I'm using some javascript to allow the movement of cell data.

The class is used to set the formatting on the header and stop items from being dragged into the fields.

Can anyone point me in the right direction on how to do this.


Solution

  • This should help you.

    $maxcols = 8; 
    $maxid = 12;
    $startid = 1;
    
    echo "<table id='table1'>\n";
    for ($i = 1;$i<=ceil($maxid/$maxcols);$i++) {
    
        echo "<tr>\n";
        for ($j=1;$j<=$maxcols;$j++)
            if ($startid <= $maxid)
                echo "  <td class='mark'>ID".$startid++."</td>\n";
            else 
                echo "  <td> </td>\n";
    
        echo "</tr>\n<tr>\n";
        for ($j=1;$j<=$maxcols;$j++)
            echo "<td>Content</td>\n";
    
        echo "</tr>\n";
    }
    
    echo "</table>\n";
    

    Generates

    <table id='table1'>
        <tr>
            <td class='mark'>ID1</td>
            <td class='mark'>ID2</td>
            <td class='mark'>ID3</td>
            <td class='mark'>ID4</td>
            <td class='mark'>ID5</td>
            <td class='mark'>ID6</td>
            <td class='mark'>ID7</td>
            <td class='mark'>ID8</td>
        </tr>
        <tr>
            <td>Content</td>
            <td>Content</td>
            <td>Content</td>
            <td>Content</td>
            <td>Content</td>
            <td>Content</td>
            <td>Content</td>
            <td>Content</td>
        </tr>
        <tr>
            <td class='mark'>ID9</td>
            <td class='mark'>ID10</td>
            <td class='mark'>ID11</td>
            <td class='mark'>ID12</td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
        <tr>
            <td>Content</td>
            <td>Content</td>
            <td>Content</td>
            <td>Content</td>
            <td>Content</td>
            <td>Content</td>
            <td>Content</td>
            <td>Content</td>
        </tr>
    </table>