Clever Geek Handbook

Dynamically creating rows and columns with PHP and HTML

I want to create dynamic rows and columns using PHP and HTML, but I'm a bit confused about this code, so some help is definitely appreciated.

<table>
<?php
  $tr = 0;
  foreach ($data as $db_data) {
    $tr++;
    if ($tr == 1) {
      echo "<tr>";
      }

    echo "<td>";
    echo $db_data['id'];
    echo "</td>";
    }

  if($tr == 2){

    }
?>
</table>

The script is so simple:

Mysql data return 6 no records from for-each loop, the result will be shown as this image

enter image description here

Just like Mysql data return 3 no records, the result will be shown like this image

enter image description here

+4


source to share


5 answers


Something like this maybe

create_table () function

function create_table($data) {
  $res = '<table width="200" border="1">';
  $max_data = sizeof($data);
  $ctr = 1;
  foreach ($data as $db_data) {
    if ($ctr % 2 == 0) $res .= '<td align="center">' . $db_data['id']. '</td></tr>';
    else {
      if ($ctr < $max_data) $res .= '<tr><td align="center">' . $db_data['id']. '</td>';
      else $res .= '<tr><td colspan="2" align="center">' . $db_data['id']. '</td></tr>';
      }
    $ctr++;
    }
  return $res . '</table>';
  }

Of course, you can change the style of the table to suit your needs.

Name it like this:



echo create_table($data);

Output

(example for 7, 4, 3 and 8 id ) enter image description here

It returns a table with the same number of rows in each column if you pass an even number of id's, or tables where the last row is concatenated if you pass an odd number of id's to the function.

+3


source


Use the% php (remainder of division) operator to split lines wherever you need



+1


source


Do something like this:

  foreach ($data as $ord => $db_data)
  {
      if (($ord == count($data) - 1) && (count($data) % 2))
      {
          // Do a colspan of 2, as it is the last item (first clause)
          // and there are an odd number of items (second clause)
      }
  }
+1


source


I think you should try doing this in a while loop. eg

$sql = your.sql.query;
$row = mysql_query($sql);
$result = mysql_fetch_arrey($row)
<table>
while($row!=0) {
echo "
<tr>
// number of <td> you need according to your data return in the query:
<td>$result['column']</td>
<td>$result['column']</td>
</tr>
";
}

if I understand what you are trying to do.

0


source


Here's the best way. This one uses Bootstrap syntax, but you can easily change it to format table

or whatever. The logic is the same. Don't forget to update the array name with $items

your own name.

<div class="container">
    <div class="row">
        <?php
        // Sample array
        $items = array(1, 2, 3, 4, 5, 6, 7, 8);

        // Define how many columns
        $cols = 6;

        $tdCount = 1; // Don't change
        foreach ($items as $key => $item)
        {
            ?>

            <div class="col"><?php echo $key; ?></div>

            <?php
            // Close and open new rows
            if( (($key + 1) % $cols) === 0  && ($key + 1) !== count($items) )
            {
                ?>
                </div>
                <div class="row">
                <?php
            }

            // Increment column count
            $tdCount++;

            // Fill with empty columns at the end
            if( ($key + 1) === count($items) && $tdCount <= $cols )
            {
                $spacers = $cols - $tdCount;
                for ($i = $spacers; $i >= 0 ; $i--)
                {
                    ?>
                    <div class="col spacer">&nbsp;</div>
                    <?php
                }
            }

            // Reset columns count
            if( $tdCount > $cols )
            {
                $tdCount = 1;
            }
        }
    ?>
    </div>
</div>

This will output:

<div class="container">
    <div class="row">
        <div class="col">0</div>
        <div class="col">1</div>
        <div class="col">2</div>
        <div class="col">3</div>
    </div>
    <div class="row">
        <div class="col">4</div>
        <div class="col">5</div>
        <div class="col">6</div>
        <div class="col">7</div>
    </div>
    <div class="row">
        <div class="col">8</div>
        <div class="col">9</div>
        <div class="col spacer">&nbsp;</div>
        <div class="col spacer">&nbsp;</div>
    </div>
</div>
0


source






More articles:


All Articles