Coloured Cells Depending on Value

[mamies]

Hi Guys,

Just something I have been trying to work on for a while is having a different colour of a cell or a row depending on the value of a field.

Lets say a field is below '80' it will display as green. Anything else is displayed as red.

Any ideas if this is possible?

Thanks,

 

[mamies]

I have read some other posts previously with little clues to where I am going. I have copied the default bootstrap template and have added a little to the bottom.

I assume my error is mainly to do with the $this->data parts but syntax could be way off as well.

Thanks,

<?php
/**
* Fabrik List Template: Bootstrap
*
* @package    Joomla
* @subpackage  Fabrik
* @copyright  Copyright (C) 2005-2013 fabrikar.com - All rights reserved.
* @license    GNU/GPL http://www.gnu.org/copyleft/gpl.html
*/
 
header('Content-type: text/css');
$c = $_REQUEST['c'];
$buttonCount = (int) $_REQUEST['buttoncount'];
$buttonTotal = $buttonCount === 0 ? '100%' : 30 * $buttonCount ."px";
echo "
 
.fabrikDataContainer {
        clear:both;
        /*
                dont use this as it stops dropdowns from showing correctly
                overflow: auto;*/
}
 
.fabrikDataContainer .pagination a{
        float: left;
}
 
ul.fabrikRepeatData {
        list-style: none;
        list-style-position:inside;
        margin: 0;
        padding-left: 0;
}
.fabrikRepeatData > li {
        white-space: nowrap;
        max-width:350px;
        overflow:hidden;
        text-overflow: ellipsis;
}
td.repeat-merge div, td.repeat-reduce div,
td.repeat-merge i, td.repeat-reduce i {
padding: 5px !important;
}
 
.nav li {
list-style: none;
}
 
.filtertable_horiz {
        display: inline-block;
        padding: 25px;
        vertical-align: top;
}
.sm_cell {"
if ($this->data['data_pivots___sm_balance'] > 80) echo 'color:#FF0000;font-weight:bold;';
if ($this->data['data_pivots___sm_balance'] = 80) echo 'color:#000000;font-weight:bold;';
else echo 'color:#339900;font-weight:bold;';
"}";

 

[mamies]

I have currently got the following working

$element = "80";
if ($element > "80.00") {echo ".sm_cell {background-color: #FF0000}";}
elseif ($element < "80.00") {echo ".sm_cell {background-color: #FF9900}";}
elseif ($element = "80.00") {echo ".sm_cell {background-color: #339900}";}

This displays the correct colour (green) for the formula. If anyone is able to assist me in getting the value from the cells as a variable that would help a lot.

Thanks,

 

[mamies]

After doing a little more reading it seems that I should be using code similar to below.

However this doesn't seem to work

$element = $this->_row->data->data_pivots___sm_balance;
if ($element > "80.00") {echo ".sm_cell {background-color: #FF0000}";}
elseif ($element < "80.00") {echo ".sm_cell {background-color: #FF9900}";}
elseif ($element = "80.00") {echo ".sm_cell {background-color: #339900}";}

 

[Bauer]

At the bottom of the code in your 2nd post in this thread you have a syntax error.
else echo 'color:#339900;font-weight:bold;';
Because both of the prior 'if' conditions have already been terminated (with a ';') - there is no 'if' for this 'else' to relate to.
You needed to properly nest those 'if' conditions like you have done in the one using the fixed value of "80" that you say is working.
I looks like you got past that issue.

Yet in this last post -
In the last elseif the proper comparative operator for "is equal to" is incorrect. It should be == not = (= assigns a value, while == compares 2 values).

You are not terminating the lines for each property being echoed to the css file.

Then, when comparing numeric values it's always best to compare numbers as integers when you can.

So putting that all together I see something like this...

$element = (int) $this->_row->data->data_pivots___sm_balance;
if ($element > 80) {echo ".sm_cell {background-color: #FF0000;}";}
elseif ($element < 80) {echo ".sm_cell {background-color: #FF9900;}";}
elseif ($element == 80) {echo ".sm_cell {background-color: #339900;}";}

If that doesn't work then the 1st line is incorrect.
Depending on where you are inserting this code, I think '$data' is an array. You are treating it like an object.
In that case change the first line to...
$element = (int) $this->_row->data['data_pivots___sm_balance'];

But then again, you never say exactly where you are using this php code. Is it in a custom css php file that is part of a fabrik template? If so, for a list or form? How do you know that "$this" is even defined? Knowing what "$this" is - and all of the possible keys or objects contained in it - would help a lot.

 

[mamies]

Thanks for the reply Bauer.

I am currently setting it up for a list and the php code is in the template_css.php.

Thanks for pointing out my syntax errors. I should have picked them up.

I have tried your suggestions above still with no luck.

The sm_balance field is just a basic text field that is hidden which is calculated on other forms. This needs to be displayed with 2 decimal places as well (not sure if this will affect the integer value we are trying to obtain.

Any more suggestions is greatly appreciated.

Thanks,

 

[lcollong]

Hi,

Just incase you miss this one : http://fabrikar.com/forums/index.php?wiki/elements/#element-list
on the bottom (list view setting tabs) :
Use as row class - If set to 'row' then each of the list view's rows will have this elements value added as an additional class name. This allows you to format rows based on the list view's data.

thus you can have a calc element for example which value would be "red" or "green" depending on the computation result. In the custom_css.php file you add the class "red" and "green" with a background-color: red / green for example and you'll get the result. I've used this often.

 

[Bauer]

I was just ready to suggest some javascript - but better yet your response. (And again I learn something new here every day.)
I initially didn't even recognize the code posted as a fabrik custom_css.php file - duhh. None of the $this-> references would work there anyhow.

 

[mamies]

That worked perfectly.

Thanks for your help guys. Once I put my little if statement in it populated the fields. I was even able to add a white class to the rest of the fields in the table which kept them from displaying the colours.

Thanks again for your help.

 

[Bren]

Thanks for above guys. I'm trying to do something similar. I have a calc element that displays the results of subtracting the number values of 2 other elements. Frequently the result is a negative number. I would like this number to display in red. I did Icollong's suggestion above; which I was then able to change the element to red via the class name within the custom_css.php file (.remaingestimatedcalc {
color:red;}. What I need some help with is how and where to add an if statement (like if (<0) {color:red;}). Does this go inside custom_css.php file and how exactly? Thanks in advance. I hope to hear from someone soon.