Create Dynamic Bootstrap Rows & Columns in PHP based on arrays

Create Dynamic Bootstrap Rows & Columns in PHP based on arrays

DATE POSTED: 10/04/2019

In this post we will explain how to create dynamic bootstrap rows and columns in PHP based on arrays.

Please use the following steps and create the dynamic bootstrap rows and columns.

STEPS

1. In this post we have created the static array values. If you required dynamic you can create it.

array (
    0 => 
        array (
            
            'profile_name' => 'User',
            'profile_job' => 'Executive Director',
            'profile_email' => 'user@email.com',
        ),
    1 => 
        array (
            
            'profile_name' => 'User',
            'profile_job' => 'Family Engagement Coordinator',
            'profile_email' => 'user@email.com',
        ),
    2 => 
        array (
            
            'profile_name' => 'User',
            'profile_job' => 'Operations Manager',
            'profile_email' => 'user@email.com',
        ),
    3 => 
        array (
            
            'profile_name' => 'User',
            'profile_job' => 'Policy Director',
            'profile_email' => 'user@email.com',
        ),
    4 => 
        array (
            
            'profile_name' => 'User',
            'profile_job' => 'Communications Director',
            'profile_email' => 'user@email.com',
        ),
)

2. You can use the following code and you will get proper row, column div tag closed

<?php
$x = 1;
$z = 1;
// Total items in the repeater field
$total_items = count($repeater);
?>
<?php
foreach($repeater as $item):
    // Check if $x is bigger than 3 then we set it back to 1
    $x = ($x > 3) ? 1 : $x;
    // if $x = 1 then we start a new row
    echo ($x == 1) ? '
' : '';
        ?>
        

           
            

            

            ">
        
    <?php
    // Check if $x is equal to 3 or if $z equal to the total of the items in the repeater
    // then its true we close the row
    echo ($x == 3) || ($z == $total_items) ? '</div>' : '';
    $x++;
    $z++;
endforeach;
?>

Thanks for using pheonix solutions.

You find this tutorial helpful? Share with your friends to keep it alive.