Loop an array based on condition in php

Question

I need help with forming an HTML div based on array loop.

My array looks like below

$myarray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18];

PHP file looks like

<?php
foreach ($myarray as $arr) {
    //I dont know how to add condition here
    echo "<div class='custom_style'>" . $arr ."</div>";
}

This is how my output should come

Let me explain clearly. Initially, I want first 2 array key would be big size then next 4 will be a small size. Again next 2 will be big and next 4 will be small..so on..I want to loop in this way till my array ends.

Please ignore CSS part.i will write by own

search about "html mosaic layout" , this may help you stackoverflow.com/questions/22221333/mosaic-of-images-html-css — aidinMC
– aidinMC, Commented Jul 29, 2017 at 6:37
@Mehul Jariwala I just want the logic...i will write custom style later based on logic — laktherock
– laktherock, Commented Jul 29, 2017 at 6:46

mickmackusa · Accepted Answer · 2017-07-30 02:31:55Z

You can avoid using "counters" if you just declare the key variable in your foreach loop.
You can avoid multiple conditionals if you leverage the modulus operator (%). It divides the first number by the second and outputs the remainder.
The indices provided by the foreach loop will start from 0, so the indices that you wish to display as big blocks will include: 0,1,6,7,12,and 13. When $i%6 is applied to these keys, the output will be 0 or 1.
Since the only thing that is changing in our echo statement is the class attribute, there is no need to repeat the full <div> line. DRY programming practices dictates that you only modify the end of the class value. To accomplish this, I have opted for an inline conditional.

This is the best/simplest way for you to accomplish your desired output.

Code: (Demo)

$myarray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18];
foreach ($myarray as $i=>$v){
    echo "<div class=\"cust",($i%6<2?1:2),"\">$v</div>\n";
}

Output:

<div class="cust1">1</div>
<div class="cust1">2</div>
<div class="cust2">3</div>
<div class="cust2">4</div>
<div class="cust2">5</div>
<div class="cust2">6</div>
<div class="cust1">7</div>
<div class="cust1">8</div>
<div class="cust2">9</div>
<div class="cust2">10</div>
<div class="cust2">11</div>
<div class="cust2">12</div>
<div class="cust1">13</div>
<div class="cust1">14</div>
<div class="cust2">15</div>
<div class="cust2">16</div>
<div class="cust2">17</div>
<div class="cust2">18</div>

Alternatively, if you aren't worried about satifying all browsers, you can use a pure css solution with nth-child() and implode().

<style> 
div:nth-child(6n+1),div:nth-child(6n+2) {
    background: red;
}
</style>
<?php
$myarray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18];
echo '<div>',implode('</div><div>',$myarray),'</div>';  // glue each value with a closing and opening div tag
?>

Mehul Jariwala · Accepted Answer · 2017-07-29 08:01:57Z

1

i write logic for your dynamic boxes now you need to create your css.

<html>
<style>
#cust_1
{
    border: 1px solid red; 
    min-width:90px; 
    min-height:90px; 
    display: inline-block;
}

#cust_2
{
    border: 1px solid red; 
    min-width:40px; 
    min-height:40px; 
    display: inline-block;
}
</style>
<?php
$myarray = array(1, 2, 3, 4, 5, 6, 7, 8, 9,10,11,12);
$i = 1;

foreach ($myarray as $arr)
 {

     if($i <= 2){
        echo "<div id=cust_1>". $arr . "</div>";
        $i++;
     }
    else if($i==6){ 
            $i=1;
        echo "<div id=cust_2>". $arr . "</div>";
    }else{
        echo "<div id=cust_2>". $arr . "</div>";
        $i++;
    }
 }
?>

answered Jul 29, 2017 at 8:01

Mehul Jariwala

9761 gold badge10 silver badges21 bronze badges

1 Comment

mickmackusa Over a year ago

Not only did Exprator answer first, his answer doesn't make the mistake of declaring duplicate ids to the dom.

Collectives™ on Stack Overflow

Loop an array based on condition in php

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related