Conditional Formatting in Report Writer HTML

Recently, I had a client request that I format the negative numbers in red on their RW report. However, since we were using a custom HTML template, we couldn’t use the Advanced Field Properties to set conditional formatting. To accomplish conditional formatting in Report Writer HTML, I used custom CSS.

Here are the basic steps. Note that this is intended for an HTML-only report. If you try and export this to Excel, you’ll see blank values in our specially-formatted cells. Depending on the formatting of your report, you could try working around this by making an invisible column/text so it’s not visible in the HTML view but flows through to Excel. However, that’s beyond the scope of this guide.

Add the CSS to the Style tab

To allow negative numbers to show as red, add the following to the CSS box under the Style tab of the report then click Save to apply the change.

/* make the cells output their value */
td[data-monetary-amount]:after {
content: attr(data-monetary-amount);
}
/* make debit amounts show up in red */
td[data-monetary-amount^=”-“]:after {
color: red;
}

Apply style to field(s) in your report

Create your report as usual but leave the fields blank where you will be applying special formatting. Here’s how ours looked:

Now add the field to your report by going to the HTML view and finding the field. Instead of entering in a value for the field, enter data-monetary-amount=”[FieldName]” within the <td> tag on the field. Here how the example above looks for the three fields between [Shipping] and [Sales Rep]:

Now when you run the report, you should see negatives as red:

Want to do more?

Congratulations! You’ve mastered a conditional format HTML report in Report Writer. Do you want to do more of your own ConnectWise reporting in Report Writer, Power BI, or another reporting tool? Contact us for one-on-one help or connect with us on the ConnectWise subreddit or the ConnectWise University Forums.