自动跨越具有相同内容的行 (php/mysql/jQuery)

Question

我正在将来自 mysql 的数据显示到网页 table。
代码（我正在使用 wordpress）：

    global $wpdb;
    $Lists = $wpdb->get_results("select * from `price_record`;");
    if($Lists== null)
    {
        echo"There is no price record yet!";
    } 
   else
   {
        echo"<table class='priceTable' style='border:1px;border-collapse:collapse;'>";
            echo"<thead>";
                echo"<tr>";
                    echo"<th>Date</th>";
                    echo"<th>Category</th>";
                    echo"<th>Type</th>";
                    echo"<th>Price</th>";
                echo"</tr>";
            echo"</thead>";
            echo"<tbody>";
            foreach ($Lists as $List) 
            {
                echo"<tr>";
                    echo"<td>".$List->Date."</td>";
                    echo"<td>".$List->Category."</td>";
                    echo"<td>".$List->Type."</td>";
                    echo"<td>".number_format($List->Price,2)."</td>";
                echo"</tr>";
            }
            echo"</tbody>";
        echo"</table>";
    }

当前结果：

Date    Category    Type    Price   
---------------------------------  
30/1    A           T1      12     
30/1    A           T2      13     
30/1    B           T3      10      
30/1    B           T4      11      
29/1    A           T1      11

预计：

Date    Category    Type    Price   
---------------------------------
30/1    A           T1      12     
                    T2      13     
        B           T3      10      
                    T4      11      
29/1    A           T1      11

如何在显示 table 时自动对日期、类别和类型进行分组？谢谢你。

Answer 1

下面的代码应该可以做到。请注意 sql 查询中的 ORDER BY 很重要。

 global $wpdb;
    $Lists = $wpdb->get_results("select * from `price_record` ORDER BY Date DESC;");
    if($Lists== null)
    {
        echo"There is no price record yet!";
    } 
   else
   {
        // Initiate dateElement
        $dateElement = '';

        echo"<table class='priceTable' style='border:1px;border-collapse:collapse;'>";
            echo"<thead>";
                echo"<tr>";
                    echo"<th>Date</th>";
                    echo"<th>Category</th>";
                    echo"<th>Type</th>";
                    echo"<th>Price</th>";
                echo"</tr>";
            echo"</thead>";
            echo"<tbody>";
            foreach ($Lists as $List) 
            {

                if($List->Date == $dateElement) {

                  // If existing day, show a blank td
                  $dateElement = '&nbsp;';
                } else {

                  // If new day, reset categoryElement and set the dateElement to the new day
                  $categoryElement = '';
                  $dateElement = $List->Date;
                }

            // If same category (and same day), show a blank td, otherwise show the category
            $categoryElement = ($List->Category == $categoryElement) ? '&nbsp;' : $List->Category;

             echo"<tr>";
                    echo"<td>".$dateElement."</td>";
                    echo"<td>".$categoryElement."</td>";
                    echo"<td>".$List->Type."</td>";
                    echo"<td>".number_format($List->Price,2)."</td>";
                echo"</tr>";
            }
            echo"</tbody>";
    echo"</table>";
}

自动跨越具有相同内容的行 (php/mysql/jQuery)

Auto span row with same content (php/mysql/jQuery)

php

mysql

jquery

html-table