CODEWITHSUNDEEP
phpmysqlhtml-tablerowbackground-color
Rubinjo13
Rubinjo13

Reputation: 65

Change table row color by mysql value

In my table I have a column named statusid. If the value of this column is 1, the complete row needs to color yellow. if the value is 2 then it needs to be red. 0 is just default white.

What is the best way to do this?

<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>

Upvotes: 1

Views: 4766

Answers (2)

Zeke
Zeke

Reputation: 1291

Ok, first of all your <thead> doesn't have a closing </tr> for the row. Second, I think it would be interesting if you used an array for this. Plus, "best" could be defined in many ways so it's hard to answer that, there are so many ways to do this depending on how you actually need it (for example if you need to use it in multiple pages).

$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>";
}

Upvotes: 1

Jeremy Harris
Jeremy Harris

Reputation: 24549

This is best done using a CSS class, that way later you can reconfigure the colors easier.

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

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

Then in your CSS, define a couple classes:

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

If you were using a framework and had some sort of view composer option available, you could make a method that you could call and make it all cleaner. Might look like:

echo "<tr class='".$view->getStatusColor($result['statusid'])."'>

I only bring that up as something to think about because dropping switch statements in your view logic can get messy really quickly.

Upvotes: 4

Related Questions