Wrap div using 2 wrapper inside array loop

Question

I am having difficulty while having the dual container div inside my for each array loop. Getting "two-half" div after each "wrap" div. But need to wrap "two-half" div with 2 "wrap" inside.

Expected:

    <div class="item">
     <div class="two-half">
      <div class="wrap">1</div>
      <div class="wrap">2</div>
     </div>
     <div class="two-half">
      <div class="wrap">3</div>
      <div class="wrap">4</div>
     </div>
    </div>
    <div class="item">
     <div class="two-half">
      <div class="wrap">5</div>
      <div class="wrap">6</div>
     </div>
     <div class="two-half">
      <div class="wrap">7</div>
      <div class="wrap">8</div>
     </div>
    </div>

Code:

<div class="item"> 
 <?php 
 $count = 1; 
 $array = array(1,2,3,4,5,6,7,8); 
 foreach($array as $item) { ?> 
  <div class="two-half"> 
   <div class="wrap"> 
     <?php echo $item; ?> 
   </div> 
  </div> 
<?php if ($count%4 == 0) { ?> 
  </div> 
<?php } $count++; } ?>

Please help me to get the expected output. Thanks!

For starters, you have the $item and $array variables backwards in the foreach — alanfcm
– alanfcm, Commented Feb 6, 2020 at 16:35
I have corrected syntax. I need the logic inside the loop. Please help with that if you knows. — PKJ Dev
– PKJ Dev, Commented Feb 6, 2020 at 16:41
Actual getting two-half div after every wrap. I need to wrap the two-half div for 2 wrap inside the item div. — PKJ Dev
– PKJ Dev, Commented Feb 6, 2020 at 16:46
why are using $count%4, you need to use $count%2, and start count with 0 — M0ns1f
– M0ns1f, Commented Feb 6, 2020 at 17:17

Briel · Accepted Answer · 2020-02-06 17:15:54Z

3

Use array_chunk to split an array into chunks.

<?php
$array = range(1, 8);
$half  = array_chunk($array, 2); // chunk for halfs
$item  = array_chunk($half, 2);  // chunk for item
$count = 1;
?>

{{-- Create div-item --}}
<?php foreach ($item as $parent) {?>
    <div class="item">

        {{-- Create div-half --}}
        <?php foreach ($parent as $half) {?>
        <div class="two-half">

            {{-- Create div-wrap --}}
            <?php foreach ($half as $item) {?>
                <div class="wrap"><?php echo $count; ?></div>
                <?php $count++;?>
            <?php }?>

        </div>
        <?php }?>

    </div>
<?php }?>

Result

<div class="item">
    <div class="two-half">
        <div class="wrap">1</div>
        <div class="wrap">2</div>
    </div>
    <div class="two-half">
        <div class="wrap">3</div>
        <div class="wrap">4</div>
    </div>
</div>

<div class="item">
    <div class="two-half">
        <div class="wrap">5</div>
        <div class="wrap">6</div>
    </div>
    <div class="two-half">
        <div class="wrap">7</div>
        <div class="wrap">8</div>
    </div>
</div>

answered Feb 6, 2020 at 17:15

Briel

1507 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

PKJ Dev Over a year ago

The element in the array can be infinite. I need the item div with 4 wrap inside. Your answer is good for static 8 element array. But I need it for (any amount) of elements in the array.

Briel Over a year ago

It can be infinite. Try to change range(from, to);

Collectives™ on Stack Overflow

Wrap div using 2 wrapper inside array loop

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related