Dynamically Change Button Color - acumatica

Question

I have added a PXAction to a custom Graph extension class. This places a "button" at the top of the screen. I want to dynamically change the color of the button in code. How can I do that? Is it possible?
I am using version 19.100.0122
TIA!

Answer 1

Note that those types of changes are not allowed by Acumatica ISV Certification program.
You can use JavaScript to change the CSS styles. Add a JavaScript element anywhere that the customization project editor will allow you:
Fill in script properties, set it as a startup script and put the following JavaScript in the script property (you'll need to change "Test" to the display name of your Action):
function setActionButtonColor(){
var x = document.getElementsByClassName("toolsBtn");
var i;
for (i = 0; i < x.length; i++) {
// Replace "Test" by the display name of your action button
if (x[i].getAttribute("data-cmd") === "Test")
x[i].style.backgroundColor = "red";
}
}
In DataSource ClientEvents->CommandPerformed property you put the name of the JavaScript method to call (setActionButtonColor):
When opening the page JavaScript method is executed and changes the background color of the Action button:
I tested with this graph extension:
public class SOOrderEntry_Extension : PXGraphExtension<SOOrderEntry>
{
public PXAction<SOOrder> test;
[PXUIField(DisplayName = "Test")]
public virtual IEnumerable Test(PXAdapter adapter)
{
return adapter.Get();
}
}