How to fetch Data from database inside bootstrap div rows and columns dynamically by php.
For example if I have 6 items in the db it should print
4 cols inside a row and 2 cols inside a row
assuming the db array is
$items = $it->getItems();
Are you asking how to get the data or how to display it?
Displaying data is simple. You loop thru the data, if it is a query, then you have to fetch one item at a time.
If it is in an array, you need to loop thru the array. On each pass, you write out part of a table. Loosely…
// If query...
echo "<table>";
echo "<tr>";
echo "<th>data 1</th><th>data 2</th><th>data 3</th><th>data 4</th>";
$query = "SELECT * FROM items";
$stmt = $PDO->query($query);
while($data = $stmt->fetch()) {
echo "<tr><td>" . $data["data1"] . "</td><td>" . $data["data2"] . "</td><td>" . $data["data3"] . "</td><td>" . $data["data4"] . "</td></tr>";
}
echo "</table>";
// For an array like $items = array(row1=>array(data1,data2,data3,data4), row2=>array(...etc....)
use something like this
echo table stuff...
foreach($items as $data) {
echo $data["data 1"], $data["data 2"] etc...
}
Since you were unclear what you needed I will guess you are talking about fetching rows from the DB
Hi mate!
Thank you for your response.
What I am trying to do is fetch the data inside bootstrap grid system. I would like to make it dynamically so a 4 columns is the max for each row and If there’s more data then it should create a new row and so on…
<div class="row">
<div class ="col-md-3">data</div>
<div class ="col-md-3">data</div>
<div class ="col-md-3">data</div>
<div class ="col-md-3">data</div>
</div>
<div class="row">
<?PHP
$query = "SELECT * FROM items";
$stmt = $PDO->query($query);
while($data = $stmt->fetch()) {
echo '<div class="row">'
echo '<div class ="col-md-3">' . $data["data1"] . '</div>';
echo '<div class ="col-md-3">' . $data["data2"] . '</div>';
echo '<div class ="col-md-3">' . $data["data3"] . '</div>';
echo '<div class ="col-md-3">' . $data["data4"] . '</div>';
echo '</div>';
}
Not a working code, just an example ! You did not give us any info on the data or where it comes from. This sample is just one possible way to do it…
Well thank you for trying to help, I appreciate it but that won’t create a new bootstrap row after 4 columns are consumed
So I want the loop to creat a new a div with class row and to fetch the data inside that row using bootstrap grid system of 4 columns and depends on how many items in the database it should be dynamically created
For example if I have 6 items
<div class="row">
<div class="col-md-3">some data</div>
<div class="col-md-3">some data</div>
<div class="col-md-3">some data</div>
<div class="col-md-3">some data</div>
</div>
<div class="row">
<div class="col-md-3">some data</div>
<div class="col-md-3">some data</div>
</div>
Hi bro!
A loop of length 4 will only fetch 4 items ? I want the data to be fetched in bootstrap grid system 4 columns for each row
No. Read the linked to documentation. It will chunk the data into arrays with length of 4, with the last array holding any remainder. If there are 6 items, the first chunk will have 4 items and the second/last chuck will have 2.
Demo code -
<?php
// $items = $it->getItems();
// fake some data - assume at least a 'name' element
$items = [];
$items[] = ['name'=>'n1'];
$items[] = ['name'=>'n2'];
$items[] = ['name'=>'n3'];
$items[] = ['name'=>'n4'];
$items[] = ['name'=>'n5'];
$items[] = ['name'=>'n6'];
foreach(array_chunk($items, 4) as $chunk)
{
// start a new section here...
echo "<div class='row'>\n";
foreach($chunk as $row)
{
// output the data within a section here...
// access elements in $row
echo "<div class ='col-md-3'>{$row['name']}</div>\n";
}
// close the section here...
echo "</div>\n";
}Output -
<div class='row'>
<div class ='col-md-3'>n1</div>
<div class ='col-md-3'>n2</div>
<div class ='col-md-3'>n3</div>
<div class ='col-md-3'>n4</div>
</div>
<div class='row'>
<div class ='col-md-3'>n5</div>
<div class ='col-md-3'>n6</div>
</div>Wow it’s working! I did not know about array chunk before…
Thank you so much…