Question
Peter Kopp · Apr 4, 2017

Different tablepane cell background colors depending on the value of a cell.

#ZEN #Ensemble

Has anybody created a way to change the background color of a cell depending on the value contained in the cell. This is simple when only one background color is required. However, if there is a requirement for several different colors depending on the value of the cell, the out of the box <condition/> approach does not suffice. Thank you for any feedback.

0
0 182
Discussion (4)3
Log in or sign up to continue
Fabian Haupt · Apr 4, 2017

If the condition is not sufficient, you can always roll your own rendering code for cells, using:
ondrawcell

0 0
Peter Kopp · Apr 4, 2017

I attempted this. Perhaps you could point out the error of my ways?

Method SetAlertColor(pTable As %ZEN.Component.tablePane, pName As %String, pSeed As %String) As %Status
{
 if (%query(pName)>30) //Orange.
  {
   //Normal:
   //s pSeed=%query(pName)
   //&html<<div> #(pSeed)#</div>>
       
   //Attempt01:
   //&html<<div style="color:#FF6600">#(pSeed)#</div>> 

   //Attempt02:
   //s pSeed="<div style="_Chr(34)_"color:#FF6600>"_Chr(34)_%query(pName)_"</div>"
   //&html<#(pSeed)#> 
  }
 if (%query(pName)>60) //Red
  {
  }
    
    q $$$OK
}

0 0
Fabian Haupt · Apr 4, 2017

Hi Peter,

a couple of things:
* You're trying to write out the numbers twice. Everything that is >60 is also >30.
* The css style for background is background-color. See CSS reference

This works for me:

Method SetAlertColor(pTable As %ZEN.Component.tablePane, pName As %String, pSeed As %String) As %Status
{
    s val=%query(pName),col=""
    if (val>60)
    {
        s col="#FF0000"
    } elseif val>30{
        s col="#FF6600"
    } else {
        s col="#AAAAAA"
    }   
    &html<<div style="background-color:#(col)#">#(val)#</div>> 
    q $$$OK
}
0 0
Peter Kopp · Apr 5, 2017

Thank you for sharing your expertise. Have a great day.

0 0