2015-10-17 14 views
0

我試圖呈現引導電網動態腳手架在PHP自舉列while循環

<div class="row> 
    <div class="col-md-3">sql row 1</div> 
    <div class="col-md-3">sql row 2</div> 
    <div class="col-md-3">sql row 3</div> 
    <div class="col-md-3">sql row 4</div> 
</div> 
<div class="row> 
    <div class="col-md-3">sql row 5</div> 
    <div class="col-md-3">sql row 6</div> 
    <div class="col-md-3">sql row 7</div> 
    <div class="col-md-3">sql row 8</div> 
</div> 

我的SQL行,我有麻煩了如何設置while循環。什麼我現在只是做

<div class="row> 
    <div class="col-md-3">sql row 1</div> 
    <div class="col-md-3">sql row 2</div> 
    <div class="col-md-3">sql row 3</div> 
    <div class="col-md-3">sql row 4</div> 
    <div class="col-md-3">sql row 5</div> 
    <div class="col-md-3">sql row 6</div> 
    <div class="col-md-3">sql row 7</div> 
    <div class="col-md-3">sql row 8</div> 
</div> 

我怎麼可以設置循環四個COL-MD-3類自動分配到各行,然後繼續。當前代碼:

<div class="row"> 
    while($row = $result->fetch_assoc()) 
{ 
    $spons_amt = round($row["spons_amt"] + 500, 2); 
echo '<div class="col-md-3">' . $spons_amt . '</div>' 
} 
mysqli_close($conn); 
</div> 

我猜我需要做的是

<div class="row"> 
    while($row = $result->fetch_assoc()) 
// count number of rows 
{ 
//list 4 of these (to make a row) 
    $spons_amt = round($row["spons_amt"] + 500, 2); 
echo '<div class="col-md-3">' . $spons_amt . '</div>' 
} 
// echo </div><div class="row"> between every set of 4 
mysqli_close($conn); 
</div> 

我要對這個正確的方式?我怎樣才能完成代碼?

回答

2

最優雅的解決方案是使用PHP的array_chunk功能:(假設你已經賺得了在$項目陣列中的所有DB行)

foreach(array_chunk($entries, 4) as $entriesRow) { 
    echo '<div class="row">'; 
     foreach ($entriesRow as $entry) { 
      echo "<div class='col-md-3'>$entry</div>"; 
     } 
    echo '</div>'; 
} 

+0

什麼變量等於:$項(我假設是行數),$項目和$進入我很困惑 – rhill45

+0

$條目是從數據庫中提取的所有行(即使用 - > fetchAll())。如果將它作爲array_chunk()的參數傳遞給參數4,它將返回4個大小的新數組。爲了循環它們,我將它們命名爲$ entriesRow(每個Bootstrap行有4個條目)。然後我們需要一個foreach循環每個包含4個條目的$ entriesRow。這聽起來很複雜,但是很簡單。你也可以查看手冊:http://php.net/manual/en/function.array-chunk.php –

1

嘗試是這樣的:

$n = 0; 
echo '<div class="row">'; 
while($row = $result->fetch_assoc()) 
{ 
    $spons_amt = round($row["spons_amt"] + 500, 2); 
    if($n%4 == && $n =! 0) { 
     echo '</div>'; 
     echo '<div class="row">'; 
     echo '<div class="col-md-3">' . $spons_amt . '</div>'; 
     $n = 1; 
    } else { 
     echo '<div class="col-md-3">' . $spons_amt . '</div>'; 
     $n++; 
    } 
} 
echo '</div>'; 
+0

會呼應的第一行作爲空 – rhill45

+0

我編輯的代碼,請重試 – kotapeter

0

不需要所有這些複雜性。 Bootstrap自動在12 col網格系統內工作。只要確保你循環並製作大小,以便平均分配12 COL-MD-4。

自12/4 = 3以來,此示例將自動提供3行。只需更新以使用ECHO或您需要的任何內容,這只是一個基本的概念示例。

<div class="row"> 
    LOOPCODE 
    { 
     <div class="col-md-4"> 
      DATA 
     </div> 
    } 
</div>