Change the CSS of an element [Solved]

[focault]

Hi,
I have a list that has scores involved, I am going to make some "views" in the database and use fabrik lists to reference them.
These views show the users their scores from a form they fill out each week for 12 weeks and shows the difference between the previous week.
So a user might have a body fat score of 17% in week 1. In week 2 they have a score of 16%.
When this score is displayed I would like the lower figure be in green text a higher figure to be red text and an equal value to be in orange.

I have a lot of other lists planned that would also need the same kind of CSS styling so if I could work out how to do one I could replicate it onto the other lists.

Thanks!

 

[cheesegrits]

That's going to need some custom JS. No way to do that using standard CSS files on the server side.

We'll need a pointer to an example page that has the list(s) that show those values, and either FTP access or exTplorer on the J! backend to create and edit the custom J! file..

-- hugh

 

[focault]

Ok the list that I need the calculations on is the Body Composition - oki1q_fab_bodycomp and for instance the element - Weight - oki1q_fab_bodycomp___Weight

In the list there is an element Week which has a values in a dropdown of 1-12 for how long the course is.
I need to do a calculation that takes the value of the weight from the previous week and takes away the last weight value.
Then I would like the value of the difference in weight to be displayed in different colours, example a decrease of weight would be displayed in green - a gain would be red - equals would be orange.

Also on the list Girth Measurements is an element Right Bicep - oki1q_fab_girth___Right_Bicep that needs to be other way round so that an increase in the value would be displayed in green - a gain would be red - equals would be orange.
Then this can be copied to all the other values in these lists.

 

[prophoto]

Just to update this one, we spent a couple of hours on chat working on MySQL views to do the "delta" part of this, i.e. calculate the differences from week to week, as if we can work out how to do it in MySQL, it'll be a lot cheaper than trying to do it in a Fabrik calc element.

-- hugh

 

[cheesegrits]

Ooops, wrong account. i was debuggin an issue with prophoto's account, forgot to log back in as me!

-- hugh

 

[focault]

any update on this? really need to get this sorted this week because I am on a deadline with this site.
Thanks!

 

[focault]

Hi,
With Hugh out of action who can help me with this? been waiting on this for a long time now.

 

[rob]

I am covering support. From Hugh's last post though I assumed the issue was fixed. Could you explain what is outstanding so I can get up to speed on the issue asap?

 

[focault]

first of all - the fabrik username in mysites is not active again.

We got to a stage where we built views to get the values neeeded the only problem was it worked fine for one user but as we tried with other users it was totally up the values for all users not users one by one.

 

[rob]

I spoke to Hugh and we decided that it would probably be simpler to do this with a form PHP plugin to calculate the changes.

I've added a hidden field element called 'weight_change' to the 'body composition' group to store the weight change.

I then edit the 'body composition' form and added a form PHP plugin with this code:

$db = JFactory::getDbo();
$data = $_POST;
$query = $db->getQuery(true);
$user = JFactory::getUser();
$week = (int) $data['oki1q_fab_bodycomp___Week'][0];
$lastWeek = $week - 1;
 
// Get the users stats for the previous week
$query->select('*')->from('oki1q_fab_bodycomp')
->where('UserID = ' . (int) $user->get('id'))
->where('Week = ' . (int) $lastWeek);
 
$db->setQuery($query);
$lastWeek = $db->loadObject();
 
 
if (is_null($lastWeek))
{ 
  // No previous week's data
  return;
}
 
// Calculate weight change
$weight = (float) $data['oki1q_fab_bodycomp___Weight'];
$weightDelta = $weight - (float) $lastWeek->Weight;
 
// Style the changes 
if ($weightDelta > 0)
{
   $weightDelta = '<span class="increase" style="color:red">' . $weightDelta . '</span>';
} else if ($weightDelta < 0)
{
   $weightDelta = '<span class="decrease" style="color:green">' . $weightDelta . '</span>';
}
 
// Update the form's data with the weight delta
$formModel->updateFormData('oki1q_fab_bodycomp___weight_change', $weightDelta);

This presumes that you are only ever going to add records, and not edit them. If you did that then you would need additonal code to re_calcuate the following weeks change as well.

You should be able to duplicate this process for the other calculations you need to set up