Wednesday, 7 December 2016

Using Colors in Acumatica

Hi All,

Today I want to share with one way how you can highlight some Acumatica rows or data with colors or other text styles.

Disclaimer: Please note that this way does not follows the standard customization way, so any changes may be not supported in future versions of Acumatica. Also it might be very complex to support this customization during Acumatica upgrades.

Before we can change colors, first of all we need to do understand how Acumatica applies styles. Acumatica uses Cascade Style Sheets (CSS). All elements (Forms, Grids, Row, Fields, Buttons, ...) are associated with one or many styles. All styles are defined in Acumatica folder itself
You can define styles in the CSS file itself or you also can apply it dynamically using ASPX Code Behind file: 

Styles are associated with controls statically in control or page itself. During creation of HTML system will get associated style and sent it to the browser.
Fortunately you can change it dynamically too. If we want to change it depend on some parameters, we need to add our logic before HTML is generated. The best way is when data is already populated but HTML is still not generated - OnDataBound. In case we want to change styles for each separate grid row we can use grid row related event OnRowDataBound.

This event handler should be defined in ASPX.Code Behind file. There you can set styles dynamically and also you can control it depend on exact values. You can get all required data right from PXGridRowEventArgs, From this class you can get rows, cells and all other required information.

As i said in the article header these changes cannot be done with standard customization. If you change it in the page itself it might be very complex to update this customization later.

Here is full code snippet:

Have a colorful development!
Big thanks for Acumatica Customization team.


Alnikko Espina said...

Hi Sergey,

Thanks for this post, I had mine working but want to know also if how it is done in fields like, Combobox or StringList??

Would appreciate much.

Sergey Marenich said...

Hi Alnikko,

Do you mean colors in specific fields?
Yes, should be fine. The same way you can access cells and their styles.
You can contact me if you have any troubles and i would be happy to assist you.

Thank you!

Alnikko Espina said...

Not in the grid but in the FormView. Cause I tried to add a databound in a combobox from a formView screen, I tried to look for the CSS properties but failed.

Sergey Marenich said...

Hi Alnikko,

I will try to prepare another example accordingly to your question. But it will take some time.

Thank you for understanding.

Harsha Sarjapur said...

Sergey, thks for posting really useful technical tips.

I have similar question for you regd colors, can we highlight specific fields on form and change it's background/foreground color based on certain criteria

For eg: Change color of grid row if the line item is below stock level in Sales order Or If certain criteria is met I want to change the custom field property to turn red.

We tried our attempt and wasn't possible appreciate your insight to this.

- Harsha

Sergey Marenich said...

Hi Harsha,

If you want to use conditions in the grid, it is very easy - just check that example and see that i'm changing color based on value of Active field. (true or false)

In case of changing colors of form controls - i'm still planing this example, but due to some issues it require time. Will post soon.

Hope it helps.