Home Blog Customization: How to Add an Action on the Right-click Menu on a Grid

Customization: How to Add an Action on the Right-click Menu on a Grid

Yuriy Zaletskyy | May 5, 2022

Introduction

The usual or default way of working with Acumatica grids is implementing buttons above the grid. But there are some people who like to have a context menu item. This way the user can use a right mouse click to perform an action.

In this article, I will describe the necessary steps you will need to take as a developer to provide this capability to your end-users.

Using Subtasks

In a use case where we need to add an action button to a grid and want this action button to appear only on the menu that opens with a right-click we will want to divide this task into two subtasks:

  1. Add an action button to the grid; and
  2. Make this button visible only on the menu that opens on a right-click

Let’s start with the first task. At every grid in an aspx file there is one part where action buttons are defined:

<px:PXGrid   …  ID=”grid” DataSourceID=”ds”>

<Levels>                                      

</Levels>

<ActionBar>

             [The action should go here]

</ActionBar>

</px:PXGrid>

In order to add an action button, we should implement it as follows:

<ActionBar>

<CustomItems>

<px:PXToolBarButton Text=”Insert Row” ImageSet=”main” ImageKey=”AddNew” DependOnGrid=”grid”>

<AutoCallBack Target=”ds” Command=”AddNewDSLine”/>                                                               

</px:PXToolBarButton>

</CustomItems>

</ActionBar>

*Note the following:

Text – the name that will appear on the screen

ImageSet and ImageKey – needed to add the icon on the button

DependOnGrid – the ID of the grid

Target – DataSourceID from the grid

Command – the name of the action in the graph

Additionally, we should add a simple action method to our graph. Something like this will work:

public PXAction<DailySales> AddNewDSLine;

[PXButton(CommitChanges = true)]

[PXUIField(Enabled = true, MapEnableRights = PXCacheRights.Select, MapViewRights = PXCacheRights.Select)]

protected virtual IEnumerable addNewDSLine(PXAdapter adapter)

{

}

Now, if we publish the project we will see this button here:

Let’s move to the second Task. To do this, we should change the

<ActionBar ToolBarVisible=”External” MenuVisible=”true”/>

Where

ToolBarVisible – with this parameter, we are making the button invisible in the menu on the top of the grid

MenuVisible – with this parameter, we add the button to the menu that open on the right click

So the final code will look like this:

<ActionBar>

<CustomItems>

<px:PXToolBarButton Text=”Insert Row” ImageSet=”main” ImageKey=”AddNew” DependOnGrid=”grid”>

             <AutoCallBack Target=”ds” Command=”AddNewDSLine”/>

             <ActionBar ToolBarVisible=”External” MenuVisible=”true”/>

</px:PXToolBarButton>

</CustomItems>

</ActionBar>

And on the screen we will have something that looks like this:

And that’s it. Pretty simple and straight forward for the most part.

Summary

In this short post, I able to show you how to add a bit of redundancy to the UI of grids by adding an Action on the Right-click Menu on a Grid. Another scenario we might be where we want to have 5 buttons in the grid above, and other types of functionaly in the context menu of the grid.

Hope this was helpful.

Happy Coding!

Blog Author

Yuriy started programming in 2003 using C++ and FoxPro then switching to .Net in 2006. Beginning in 2013, he has been actively developing applications using the Acumatica xRP Framework, developing solutions for many clients over the years. He has a personal blog, aptly named Yuriy Zaletskyy’s Blog, where he has been documenting programming issues he’s run into over the past six years – sharing his observations and solutions freely with other Acumatica developers.

Receive blog updates in your Inbox.