Skip to main content
Question

Change custom button color in Shipments screen

  • March 26, 2026
  • 1 reply
  • 30 views

Forum|alt.badge.img

Hi community,
I am trying to apply custom styling (background-color and font-weight) to a custom action button on the Shipments (SO302000) screen header in the Modern UI.


Here is my code for the Classic UI:

 

        #region Actions
public PXAction<SOShipment> bZProcessShipment;

[PXButton(Category = "Processing")]
[PXUIField(DisplayName = "Process Shipment", MapEnableRights = PXCacheRights.Select, MapViewRights = PXCacheRights.Select)]
// Upgraded to Acumatica 2025 R2 by Biz_Vahe
protected IEnumerable BZProcessShipment(PXAdapter adapter)
{
string shipmentNbr = Base.Document.Current?.ShipmentNbr;
if (string.IsNullOrEmpty(shipmentNbr))
return adapter.Get();

var adapterCopy = adapter;

Base.Save.Press();

PXLongOperation.StartOperation(this, () =>
{
var shipmentGraph = PXGraph.CreateInstance<SOShipmentEntry>();
//PXGraph sourceGraph = shipmentGraph.GetOrigDocumentGraph(string.Empty);
var orderEntry = PXGraph.CreateInstance<SOOrderEntry>();


SOShipment shipment = PXSelect<SOShipment,
Where<SOShipment.shipmentNbr, Equal<Required<SOShipment.shipmentNbr>>>>
.Select(shipmentGraph, shipmentNbr);

if (shipment == null)
throw new PXException(Messages.ShipmentNotFound, shipmentNbr);

#region Confirm Shipment
shipmentGraph.GetExtension<ConfirmShipmentExtension>().PrepareShipmentForConfirmation(shipment);
if (shipment.Confirmed != true)
{

shipmentGraph.ShipPackages(shipment);
shipmentGraph.GetExtension<ConfirmShipmentExtension>().ConfirmShipment(new ConfirmShipmentArgs(shipment, orderEntry, true));
}
#endregion

#region Email Shipment
var parameters = new Dictionary<string, string>
{
["SOShipment.ShipmentNbr"] = shipment.ShipmentNbr
};

var branch = PXSelectReadonly2<PX.Objects.GL.Branch,
InnerJoin<INSite, On<INSite.branchID, Equal<PX.Objects.GL.Branch.branchID>>>,
Where<INSite.siteID, Equal<Required<SOShipment.destinationSiteID>>,
And<Required<SOShipment.shipmentType>, Equal<SOShipmentType.transfer>,
Or<INSite.siteID, Equal<Required<SOShipment.siteID>>,
And<Required<SOShipment.shipmentType>, NotEqual<SOShipmentType.transfer>>>>>>
.SelectSingleBound(shipmentGraph, null,
shipment.DestinationSiteID, shipment.ShipmentType,
shipment.SiteID, shipment.ShipmentType);

shipmentGraph
.GetExtension<SOShipmentEntry_ActivityDetailsExt>()
.SendNotification(ARNotificationSource.Customer, "SHIPMENT", shipmentGraph.Accessinfo.BranchID, parameters, false);
#endregion

#region Print Labels
var labelsPrintingExt = shipmentGraph.GetExtension<LabelsPrinting>();

labelsPrintingExt.PrintCarrierLabels();
#endregion

#region Print Shipment Confirmation
shipmentGraph.Report(adapterCopy.Apply(it => it.Menu = "Print Shipment Confirmation"), "SO642000");
#endregion
});

return adapter.Get();
}
#endregion
<px:PXJavaScript runat="server" ID="CstJavaScript2" IsStartupScript="True" Script="function setActionButtonColor() {     var btn = document.getElementById("ctl00_phDS_ds_ToolBar_BZProcessShipment&quot;);     if (btn) {         btn.style.backgroundColor = &quot;#ffff00&quot;;         btn.style.color = &quot;#87b745&quot;;         btn.style.fontWeight = &quot;bold&quot;;     } }" />
<px:PXLayoutRule runat="server" ColumnSpan="2" StartRow="true" LabelsWidth="S" ></px:PXLayoutRule>

 

1 reply

arpine08
Jr Varsity I
Forum|alt.badge.img+1
  • Jr Varsity I
  • March 26, 2026

Hi ​@VaheGhazaryan,

You can use the following example to implement custom button coloring in the Modern UI:

CSS:

.btnApply button {
background-color: #107C10 !important;
color: #FFFFFF !important;
}

HTML:

<template>
<require from="./SO302000_Highlight.css"></require>
....
<qp-button id="btnMyApply" state.bind="myApply" class="btnApply"></qp-button>
....
</template>

or directly HTML:

<template>
<style>
.btnApply button {
background-color: #107C10 !important;
color: #FFFFFF !important;
}
</style>
.....
<qp-button id="btnMyApply" state.bind="myApply" class="btnApply"></qp-button>
.....
</template>

Result: