通过mysql值更改表格行颜色

时间:2017-05-09 18:19:17

标签: php mysql html-table row background-color

在我的表中,我有一个名为statusid的列。如果此列的值为1,则整行需要着色为黄色。如果值为2则需要为红色。 0只是默认的白色。

这样做的最佳方式是什么?

<div class="container-fluid">
     <table id="table_id" class="cell-border order-column row-border hover compact"  width="100%">
        <thead>
            <tr>
            <th width="2%">ID</th>
            <th width="6%">Debiteur</th>
            <th width="10%">Klantnaam</th>
            <th width="3%">Aantal Pallets</th>
            <th width="3%">Totaal Gewicht</th>
            <th width="30%">PB Nummers</th>
            <th width="10%">Toevoegdatum</th>
            <th width="1%">statusid</th>
        </thead>
        <tbody>
            <!-- Fetch from db -->
            <!-- Connect to db-->>
         <?php
         $conn = mysqli_connect("localhost","root","","export") or die("Error in Connection");

         $query = mysqli_query($conn, "SELECT exportid, deb_nmr, cost_name, numb_pal, tot_weight, pb_s, date, statusid FROM export_tabel");

            while ($result = mysqli_fetch_array($query)) {
                echo "<tr>
                    <td>".$result['exportid']."</td>
                    <td>".$result['deb_nmr']."</td>
                    <td>".$result['cost_name']."</td>
                    <td>".$result['numb_pal']."</td>
                    <td>".$result['tot_weight']."</td>
                    <td>".$result['pb_s']."</td>
                    <td>".$result['date']."</td>
                    <td>".$result['statusid']."</td>
                </tr>";
            }

            ?>
        </tbody>
     </table> 
   </div>

2 个答案:

答案 0 :(得分:4)

最好使用CSS类完成,稍后您可以更轻松地重新配置颜色。

def to_representation(self, instance):
    data = super(MySerializer, self).to_representation(instance)
    return data['json_representation']

然后在CSS中定义几个类:

switch ((int) $result['statusid']) {
   case 1:
      $rowClass = "row-yellow";
      break;
   case 2:
      $rowClass = "row-red";
      break;
   default:
      $rowClass = "row-default";
}

echo "<tr class='".$rowClass."'>

如果您使用的是框架并且有某种视图编辑器选项可用,那么您可以制作一个可以调用的方法并使其更加清晰。可能看起来像:

.row-yellow {
   background-color: yellow;
}
.row-red {
   background-color: red;
}

我只是把它当作想要考虑的东西,因为在视图逻辑中删除switch语句会很快变得混乱。

答案 1 :(得分:1)

好的,首先你的<thead>没有该行的结束</tr>。其次,我认为如果你使用数组就会很有趣。另外,“最佳”可以通过多种方式定义,因此很难回答,根据您的实际需要,有很多方法可以做到这一点(例如,如果您需要在多个页面中使用它)。

$colors = ['white', 'yellow', 'red']; // or any other string, like a HEX color or a class name (which would change the code below, but do as you wish or prefer)
while ($result = mysqli_fetch_array($query)) {
    echo "<tr style='background-color: ".$colors[$result['statusid']].";'>
        <td>".$result['exportid']."</td>
        <td>".$result['deb_nmr']."</td>
        <td>".$result['cost_name']."</td>
        <td>".$result['numb_pal']."</td>
        <td>".$result['tot_weight']."</td>
        <td>".$result['pb_s']."</td>
        <td>".$result['date']."</td>
        <td>".$result['statusid']."</td>
    </tr>";
}