Search code examples
phpcsstwitter-bootstrapscaffolding

Bootstrap Scaffolding in php's loop


How do I make scaffolding if I would like to show grids next to each other. My actual codes

<div class="span8">
<div class="row-fluid">
<?php foreach($items as $item) : ?>
   <div class="span6">
      <?= $item ?>
   </div>
<?php endforeach; ?>
</div>
</div>

grids are showing like

-------------------
1box       2box
-------------------
3box
-------------------
4box
-------------------
5box
-------------------

I would like to show

-------------------
1box       2box
-------------------
3box       4box
-------------------
5box
-------------------

Solution

  •    <div class="span8 mutli-column">
           <?php   
             $c = 0;
             foreach( $items as $item ):
    
                //Needs Break Boolean, true if counter at second column
                $b = (( ++$c % 2 == 0 ) ? true : false );
    
                if ( $b ) 
                    echo '<div class="row-fluid">'; ?>
    
                   <div class="span6">
                        <?php echo $item; ?>
                   </div>
    
               <?php
                if ( $b ) 
                    echo '</div>';
    
           endforeach; ?>
      </div>
    

    With use of % Modulus, you can calculate every second iteration, thus break into a new .row-fluid row, to get yourself into a HTML structure like below:

    <div class="span8 mutli-column">
        <div class="row-fluid">
            <div class="span6">1</div>
            <div class="span6">2</div>
        </div>
        <div class="row-fluid">
            <div class="span6">3</div>
            <div class="span6">4</div>
        </div>
        <div class="row-fluid">
            <div class="span6">5</div>
            <div class="span6">6</div>
        </div>
        <div class="row-fluid">
            <div class="span6">7</div>
            <div class="span6">8</div>
        </div>
    </div>
    

    Here's a Fiddle constructed with the above: