在每個if循環結果的末尾之后添加回顯線

Question

我有一個數據庫：

id | tableid | timein | itemdesc | qty
01 | 13 | 11:00 | apples | 4
02 | 13 | 11:00 | bread | 1
03 | 13 | 11:00 | chips | 40
01 | 8 | 17:00 | coffee| 1
02 | 8 | 17:00 | rocket| 1
03 | 8 | 17:00 | snickers | 180

我從相同的Column（tableid）中排序得到信息。 並且所有信息都放在卡片中。 每個卡（tableid）一張。 所以我寫這樣的東西：

$getsql = "SELECT * FROM 2dopuzzler ORDER BY tableid";
$itsresult = $conn->query($getsql);

// Good one...
$current_cat = null;
while($row = $itsresult->fetch_assoc()) {   
    if ($row["tableid"] != $current_cat) {
        $current_cat = $row["tableid"]; // Table Number
        $timein = $row["timein"]; // Placing Order Time
        // PRINT THE ORDER CARD
        echo "<div class='col s12 m6 l3'>";
        echo "<div class='card'>";
        echo "<div class='card-content '>";
        echo "<div class='row'>";
        echo "<div class='col s12 m4 l4 card-wtime'> <i class='tiny material-icons'>add</i><span class='card-wtimetext'>$timein</span> </div>";
        echo "<div class='col s12 m4 l4'>   <a class='  card-nday waves-effect waves-light red'> <span class='card-ndaytext'>$current_cat</span> </a></div>";
        echo "<div class='col s12 m4 l4 card-alldone-btn'> <i class='medium material-icons'>check</i> </div>";
        echo "</div>";
        echo "<div class='row'>";
    } 
    echo "<div class='card-line'>";
    echo " -- ". $row["itemdesc"]." <span class='card-line-q'> ". $row["qty"] . "</span>";

但是結果不是很好。 這是因為該結構在每個循環的末尾都有其他div ...因此，它應該如何工作：

    while (i get lines from db) {
             if ($row["tableid"] != $current_cat) {
    // here open divs
    }
   // here it cycles through db lines adding to card header text

   // (!) here I need closed divs which adding NOT at an end of each db line
   // BUT when $current_cat is changing!


}
//here over all endig divs...

因此，請幫助我理解如何編寫這樣一個循環，該循環首先帶來標題（包含兩個變量-這些變量對於信息卡的其余部分是通用的），其次-看起來像列表的行（項目+數量），最后關閉信息卡的是附錄。

拜托，你能幫我嗎？ ）

這里是所需的html輸出：

<div class="col s12 m6 l3">
      <!-- Card 1 -->
        <div class="card">
          <div class="card-content ">
            <div class="row">
            <div class="col s12 m4 l4 card-wtime"> <i class="tiny material-icons">add</i><span class="card-wtimetext ">13:00</span> </div>
            <div class="col s12 m4 l4">   <a class="  card-nday waves-effect waves-light red"> <span class="card-ndaytext">13</span> </a></div>
            <div class="col s12 m4 l4 card-alldone-btn"> <i class="medium material-icons">check</i> </div>

            </div>

            <div class="row">

            <div class="card-line">
            Here goes the header of an info card
    <span class="card-line-q"> Here goes the sub-header of an info card</span>
            </div>

    (!) Here goes cycled information from database. Like that $NAME ; $quantity

    // echo " -- ". $row["itemdesc"]." <span class='card-line-q'> ". $row["qty"] . "</span>";

//這里開始html我無法添加...

        </div>


      </div>
      <div class="card-action">
        // here an appendix of an info card
      </div>
    </div>



  </div>

//在這里結束...

Answer 1

問題在於，當您開始一個新類別時，您沒有結束上一個類別的DIV。 因此，每個類別都嵌套在上一個類別中。

$getsql = "SELECT * FROM 2dopuzzler ORDER BY tableid";
$itsresult = $conn->query($getsql);

// Good one...
$current_cat = null;
while($row = $itsresult->fetch_assoc()) {   
    if ($row["tableid"] != $current_cat) {
        if ($current_cat) { // end previous card
            echo "</div></div></div></div>";
        }
        $current_cat = $row["tableid"]; // Table Number
        $timein = $row["timein"]; // Placing Order Time
        // PRINT THE ORDER CARD
        echo "<div class='col s12 m6 l3'>";
        echo "<div class='card'>";
        echo "<div class='card-content '>";
        echo "<div class='row'>";
        echo "<div class='col s12 m4 l4 card-wtime'> <i class='tiny material-icons'>add</i><span class='card-wtimetext'>$timein</span> </div>";
        echo "<div class='col s12 m4 l4'>   <a class='  card-nday waves-effect waves-light red'> <span class='card-ndaytext'>$current_cat</span> </a></div>";
        echo "<div class='col s12 m4 l4 card-alldone-btn'> <i class='medium material-icons'>check</i> </div>";
        echo "</div>";
        echo "<div class='row'>";
    } 
    echo "<div class='card-line'>";
    echo " -- ". $row["itemdesc"]." <span class='card-line-q'> ". $row["qty"] . "</span>";
    echo "</div>";
}
if ($current_cat) { // end last card
    echo "</div></div></div></div>";
}