Change table row color by mysql value

Question

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>

Jeremy Harris · Accepted Answer · 2017-05-09 18:28:53Z

4

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.

edited May 9, 2017 at 18:28

answered May 9, 2017 at 18:23

Jeremy Harris

24.7k13 gold badges84 silver badges133 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Zeke · Accepted Answer · 2017-05-09 18:30:35Z

1

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

answered May 9, 2017 at 18:30

Zeke

1,2911 gold badge18 silver badges26 bronze badges

2 Comments

Rubinjo13 Over a year ago

That works fine for me! only thing is: Notice: Undefined index: in /Applications/XAMPP/xamppfiles/htdocs/export/datatables.php on line 123. that is the following code: echo "<tr style='background-color: ".$colors[$result['statusid']].";'>

Zeke Over a year ago

That's because the number given by your column didn't match an index in the array. Notice that the array has 3 elements, and their indexes are 0, 1 and 2. So if there's any column on your database with a statusid that is not 0, 1 or 2, then this error will show up. You can work that out in many different ways, for example giving your array a specific index, that is to say: [0 => 'white', 23 => 'red']. With this array, then the statusid of 0 represents white and 23 represents red. You can search about arrays on php.net

Collectives™ on Stack Overflow

Change table row color by mysql value

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related