CODEWITHSUNDEEP
phpcss
David
David

Reputation: 1191

add css class to mysql result based on criterias

I populate a list of dates from a MySQLdatabase like this:

<?php
    while ($row = mysql_fetch_array($list_customers)) {
        echo "<tr>\n";
            echo "<td>".$row['customer_date']."</td>\n";
        echo "</tr>\n";
    }
?>

Now I would like to add the result inside a <span> that changes class='' based on some criteria:

Would this be possible? Thanks in advance.

Upvotes: 1

Views: 764

Answers (2)

Spudley
Spudley

Reputation: 168685

It's really just a simple case of writing the if() conditions you specified. There's no magic to it.

Firstly, we need to know what format your customer_date field is in. Since you're printing it directly into the HTML code I guess it's in a text format, so the first thing we need to do is convert it to a date object.

$custDate = new DateTime($row['customer_date']);

This will only work if the date is in a suitable format, but to be honest if it isn't in standard MySQL date format then you should stop now and fix that before we go any further.

You'll also need the current date as a date object:

$currDate = new DateTime();

Now you can compare them easily enough using the methods on the DateTime class:

$dateDiff = $currDate->diff($custDate)->days;

Now you've got that, you can just do your if() conditions.

However, I would note a few things:

  1. You're using mysql_fetch_array(). Please note that the mysql_ functions are considered obsolete; you should replace with mysqli_xxx or the PDO library wherever possible.

  2. You suggest putting the class into a <span> inside the <td> -- it is possible to put the class directly into the <td>. This would be a cleaner option, so I'll use that in the answer, though it is up to you.

  3. You suggest using class names red, green, yellow. Please note that this is not a particularly good use of class names. Class names should reflect what the element is actually for, rather than how it looks. This is because the whole point of using classes and separating the styles away from the HTML is so that the styles can be changed without needing to alter the HTML. But if the class names are just colour names, it ties it logically to that colour; you may just as well put the colours directly into the HTML. Better choices of class name would perhaps be something like custExpired, custNearlyExpired, etc. That would give you more flexibility later, and make the code easier to understand for anyone reading it (eg the google bot!).

So with all that in mind, here's some code for you:

$currDate = new DateTime();
while ($row = $mysqli->fetch_array($list_customers)) {
    $custDate = new DateTime($row['customer_date']);
    $dateDiff = $currDate->diff($custDate)->days;

    $class = '';
    if($dateDiff < 30) { $class = 'custNearlyExpired'; }
    if($dateDiff < 0) { $class = 'custExpired'; }

    echo "<td class='custDate {$class}>{$row['customer_date']}</td>\n";
}

and CSS:

td.custDate {
    background: green;
}
td.custDate.custNearlyExpired {
    background: yellow;
}

td.custDate.custExpired {
    background: red;
}

Hope that helps.

Upvotes: 2

Palladium
Palladium

Reputation: 3763

Yes it is. Just compare your date with current time using a series of if statements and assign a variable to the class name, like this:

while ($row = mysql_fetch_query($list_customers)) {
    echo "<tr>\n";
    $class = "class='green'";
    if (strtotime($row['customer_date']) < time()) {
        $class = "class='red'";
    }elseif (strtotime($row['customer_date']) < time() + 30*24*3600) {
        $class = "class='yellow'";
    }
    echo "<td><span $class>" . $row['customer_date'] . "</span></td>\n";
    echo "</tr>\n";
}

Upvotes: 3

Related Questions