as title says I wanna chunk an array by three and display results each in a single row.
In JS no problems:
const array = [1,2,3,4,5,6,7];
let i, arr, j;
for (i = 0; i < array.length; i += 3) {
arr = array.slice(i, i + 3);
let div = document.createElement("div");
div.classList.add('row');
for (j = 0; j < arr.length; j++) {
let par = document.createElement("p");
let res = document.createTextNode(arr[j]);
par.appendChild(res);
div.appendChild(par);
}
document.body.appendChild(div);
}
Getting correctly:
<div class="row">
<p>1</p>
<p>2</p>
<p>3</p>
</div>
<div class="row">
<p>4</p>
<p>5</p>
<p>6</p>
</div>
<div class="row">
<p>7</p>
</div>
In PHP, with this:
<?php
$array = [1,2,3,4,5,6,7];
for ($i = 0; $i < count($array); $i += 3) :
$arr = array_slice($array, $i, $i + 3);
?>
<div class="row">
<?= implode(" ", $arr); ?>
</div>
<?php endfor; ?>
I get:
<div class="row">
<p>1</p>
<p>2</p>
<p>3</p>
</div>
<div class="row">
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
</div>
<div class="row">
<p>7</p>
</div>
I always get the middle row wrong (even if you increase $array), what am I missing? :/