CODEWITHSUNDEEP
phpmysqlformat
Ivy
Ivy

Reputation: 111

PHP - How to format cell background and font color according to MySQL query result in PHP file

I have workable mysql query in PHP file. It is giving me 3 possible different results in my table on site in one column. They are 'WON', 'LOST', or 'PENDING'. What i want to achieve further is when there is WON word in those specific cell to be in green background, when query result turns LOST to be red background, when PENDING to be grey.

In which way to do this? I am newbie in this so couldnt find anser myself online.

Here is code of workable query:

<?
$qry = "
SELECT timelive,match_title,selection,
CASE 
WHEN game.result LIKE '' THEN 'PENDING'
WHEN game.result LIKE game.selection THEN 'WON'
WHEN game.result NOT LIKE game.selection THEN 'LOST'
END AS result
FROM game
";
$searchText = "";
if($_REQUEST['search_text']!=""){
    $searchText = mysql_real_escape_string($_REQUEST['search_text']);
    $qry .=" WHERE game.timelive LIKE '%$searchText%' " . 
           " OR game.match_title LIKE '%$searchText%' " .
           " OR game.selection LIKE '%$searchText%' " .
           " OR game.username LIKE '%$searchText%'";
}

$qry .= " ORDER BY timelive DESC";

$obj = new pagination_class($qry,$starting,$recpage);       
$result = $obj->result;

?>

and HTML part of code for this part of output on site is this:

<table>
<?if(mysql_num_rows($result)!=0){
$counter = $starting + 1;
while($data = mysql_fetch_array($result)) {?>
<tr>
<td align="center"><? echo $data['username']; ?></TD>
<td align="center"><? echo $data['result']; ?></TD>
</tr>
<?
$counter ++;
} ?>

i need to get this desired formatting described above according to output word in 'result' column. Thanks.

Upvotes: 0

Views: 3399

Answers (5)

jogesh_pi
jogesh_pi

Reputation: 9782

before echo the result put an condition like

if( $data['result'] == 'WON' ){
    echo '<div class="green">' . $data['result'] . '</div>'    
}
elseif( $data['result'] == 'LOST' ){
    echo '<div class="red">' . $data['result'] . '</div>'    
}
elseif( $data['result'] == 'PENDDING' ){
    echo '<div class="gray">' . $data['result'] . '</div>'    
}

Upvotes: 0

Grant Thomas
Grant Thomas

Reputation: 45083

A couple of options, the brute-force way, in which you simply apply a generated style, or by predefining style classes and applying them based on the output...

In the latter case (most reasonable, IMO), you simply apply the content of $result to the class property:

<td align="center" class="<?php echo $result;?>"><? echo $data['result']; ?></td>

In the first case, you might have something like this:

function getStyleColorForStatus($status) {
  if ($status == 'WON') {
    return 'Green';
  }
  else if ($status == 'LOST') {
    return 'Red';
  }
  else if ($status == 'PENDING') {
    return 'Grey';
  }
  return '';
}

<td align="center" style="background-color:<?php echo getStyleColorForStatus($data['result']); ?>"><? echo $data['result']; ?></td>

Upvotes: 1

kasimir
kasimir

Reputation: 1554

Assign a css class to your table cell, based on the result, like so:

$tdClass = '';

switch ($data['result']) {
    case 'WON':
        $tdClass = 'won';
        break;
    case 'LOST':
        $tdClass = 'lost';
        break;
    case 'PENDING':
        $tdClass = 'pending';
        break;
}

So obviously, this is your php, in your html you do:

<td class="<?php $tdClass; ?>"><?php echo $data['result']; ?></td>

I would lose the align="center" and use in your css text-align: center; instead. Furthermore, in your css, you'd do:

.won {
    background: green;
}
.lost {
    background: red;
}
.pending {
    background: grey;
}

But instead of green, red, etc. choose the exact color you like.

Upvotes: 0

Lajos Arpad
Lajos Arpad

Reputation: 76424

Create the following css definitions, if possible in a separate css file:

.won
{
background-color:green;
}

.lost
{
background-color:red;
}

After this, link the css file to your page and finally use jQuery to add/remove the css class depending on the given condition.

You can read more on the following links:

http://api.jquery.com/removeClass/

http://api.jquery.com/addClass/

Upvotes: 0

sascha
sascha

Reputation: 4690

I'm missing the part, which creates your $data variable.

Just add "game.result" to your $data array. Now in your code, you could do something like this:

<tr>
<td align="center" class="<? echo $data['result'];?>"><? echo $data['username']; ?></TD>
<td align="center"><? echo $data['result']; ?></TD>
</tr>

Now you can work with CSS. Create three classes for LOST, PENDING and WON. Example:

.LOST {
    background-color: #F00;
}

Your username field in your table should have a red background, when game.result is "LOST"

Upvotes: 0

Related Questions