Yii2 generate 3 column table using foreach - foreach

Question

how do i generate only 3 columns in a page using below code
if i keep echo'(table)' inside it generates the whole table so i want only one table
allow only 3 columns in a page after 3 columns append a new row
<?php
$i = 0;
echo '<table style="float: left;width: -weekbit-fill-available"; ><tr>';
?>
<?php foreach ($product as $p) {
$i++;
// $i++;
echo "<tr><td>Name:<b>". $p->name ."</td></tr>";
echo "<tr><td>productID:<b>".$p->proid ."</td></tr>";
echo "<tr><td>Price:<b>". $p->price ."</td></tr>";
echo "<tr><td><a href='/cart/cart/add?id=$p->proid'><input type='button' value='addtocart'/></td></tr>";
if($i==3){
echo '</tr><tr>';
}
echo"</tr>
</table>";
?>
<?php }?>
<?php echo"</tr>
</table>"?>
thanks in advance

Answer 1

Try below
<table style="float: left; width: -weekbit-fill-available">
<tr>
<th>Name</th>
<th>ProductID</th>
<th>Price</th>
<th>Action</th>
</tr>
<?php foreach ($product as $p) : ?>
<tr>
<td><?= $p->name ?></td>
<td><?= $p->proid ?></td>
<td><?= $p->price ?></td>
<td colspan="3"><?= \yii\helpers\Html::a('addtocart',
['/cart/cart/add', 'id' => $p->proid],
[
'title' => 'Add to Cart',
'class' => 'btn btn-warning btn-sm',
]); ?></td>
</tr>
<?php endforeach; ?>
</table>

Answer 2

Use <tr> for each row and <td> for each column
<table style="float: left; width: -weekbit-fill-available"; >
<?php foreach ($product as $p): ?>
<tr>
<td>Name: <b><?= $p->name ?></td>
<td>productID: <b><?= $p->proid ?></td>
<td>Price: <b><?= $p->price ?></td>
<td><a href='/cart/cart/add?id=<?= $p->proid ?>'><input type='button' value='addtocart'/></td>
</tr>
<?php endforeach; ?>
</table>";
See also:
HTML tables https://www.w3schools.com/html/html_tables.asp
Yii2 GridView https://www.yiiframework.com/doc/guide/2.0/en/output-data-widgets