Beast Mode for Conditional Formatting of Standard Table

walex
walex Domo Employee













Description: The following Beast Mode examples will help you create conditional formatting on a standard (non-Sumo) table which I've used in the instances that a client needs a modified drill path table view. At present, these options are not available w/in Sumo tables but may be as development continues. Please up-vote this post and include comments any time these tips are used so we can keep track of how much value we can provide with these new options. 

 

The formatting is accomplished by creating an HTML string which contains a DIV element where the background color changes based on user defined conditions. The three colors are "Domo" colors as well so it wil keep a consistent user experience.

 

Green Background (#bbe491):

 

CONCAT('<div style="background-color:#bbe491; width: 100%; height:100%; margin:-20px; padding:20px"><a href="#">', 'Green Conditional Format', '</a></div>')

 

Yellow Background (#fccf84):

 

CONCAT('<div style="background-color:#fccf84; width: 100%; height:100%; margin:-20px; padding:20px"><a href="#">', 'Yellow Conditional Format', '</a></div>')

 

Red Background (#fcbcb7):

 

CONCAT('<div style="background-color:#fcbcb7; width: 100%; height:100%; margin:-20px; padding:20px"><a href="#">', 'Red Conditional Format', '</a></div>')

 

Note: The <a> element with a reference to # prevents the user from drilling on that column as it would create a filter for the full HTML string.

 

Working Example:

 

CASE

WHEN `CHANGE` > 0 THEN CONCAT('<div style="background-color:#bbe491; width: 100%; height:100%; margin:-20px; padding:20px"><a href="#">', `CHANGE`, '</a></div>')

WHEN IFNULL(`CHANGE`, 0) = 0 THEN CONCAT('<div style="background-color:#fccf84; width: 100%; height:100%; margin:-20px; padding:20px"><a href="#">', `CHANGE`, '</a></div>')

WHEN `CHANGE` < 0 THEN CONCAT('<div style="background-color:#fcbcb7; width: 100%; height:100%; margin:-20px; padding:20px"><a href="#">', `CHANGE`, '</a></div>')

END

 Screen Shot 2015-01-23 at 1.35.33 PM.png

 

Note: Keep in mind that the value this Beast Mode returns is a STRING, any aggregations must be done w/in Beast Mode as aggregations will be disabled when building cards.











 

 





 

 






 

 













 

Best Answer

  • [Deleted User]
    Answer ✓

    This was from an internal article we are publicly sharing now.

    Thanks!

Answers

  • [Deleted User]
    Answer ✓

    This was from an internal article we are publicly sharing now.

    Thanks!

  • I would really like for this to be a standard feature without requiring Beast Mode. Doing this as Beast Mode severely limits how you can use this for numeric values. For instance, because it becomes a string and can't be displayed as a numeric, it prevents you from using a Total row. 

     

    It's a major gap to me that you can't format a cell based on its relationship to a different cell.