How to Add a Popup Window in Acumatica When Clicking a Button
Introduction
In Acumatica, you can enhance your custom screens by adding a button that triggers a popup window (SmartPanel). This is particularly useful for selecting records, displaying details, or gathering additional input before processing an action. This guide will walk you through how to add an "Add Order" button that opens a popup with purchase order details relevant to the selected customer.
Understanding the Requirements
To achieve this functionality, you need to:
- Define an action in the graph extension that triggers the popup.
- Create a SmartPanel to display the purchase order details.
- Modify the ASPX file to include the button and configure the callback.
Step 1: Define the Action in the Graph Extension
First, create an action in the graph extension to trigger the SmartPanel:
public PXAction<MyDac> addOrder;
[PXUIField(DisplayName = "Add Order", MapEnableRights = PXCacheRights.Select, MapViewRights = PXCacheRights.Select)]
[PXLookupButton]
public virtual IEnumerable AddOrder(PXAdapter adapter)
{
orderList.AskExt(); // Displays the popup window
return adapter.Get();
}
Explanation:
● PXAction<MyDac>: Defines the action tied to your data access class (DAC).
● [PXLookupButton]: Specifies that this action triggers a lookup-style popup.
● orderList.AskExt();: Opens the SmartPanel when the button is clicked.
Step 2: Modify the ASPX File
Now, update the ASPX page to include the "Add Order" button and link it to the action:
<ActionBar>
<CustomItems>
<px:PXToolBarButton Text="Add Order" Key="cmdOrderList">
<AutoCallBack Command="AddOrder" Target="ds">
<Behavior PostData="Page" CommitChanges="True" />
</AutoCallBack>
</px:PXToolBarButton>
</CustomItems>
</ActionBar>
Explanation:
● <px:PXToolBarButton>: Adds a new button labeled "Add Order".
● <AutoCallBack Command="AddOrder" Target="ds">: Links the button to the AddOrder action defined in the graph.
● <Behavior PostData="Page" CommitChanges="True" />: Ensures any unsaved changes are committed before executing the action.
Step 3: Deploy and Test
- Save the changes to the graph and ASPX file.
- Publish the customization package in Acumatica.
- Navigate to the screen, click "Add Order", and verify that the popup appears with the correct data.
Conclusion
By following these steps, you can integrate popups (SmartPanels) into your Acumatica screens, improving the UI experience by displaying relevant data in modal windows instead of redirecting users to another page.