Use of SysListPanelRelationTable application class

As we know frequent users might notice that some of the Dynamics AX forms contain two sections placed next to each other and allow moving items from one side to the other. 

Normally, the right section contains a list of possible values and the left one contains a list of the already selected values. Buttons in the middle allow data to be moved from one side to another.Double-click and drag-and-drop mouse events are also supported. 

Such a design improves the user experience as data manipulation becomes more user-friendly. Some of the examples in the standard application are General ledger | Setup | Financial dimensions | Financial dimension sets or System administration | Common | Users | User groups. This functionality is based on the SysListPanelRelationTable application class. 

Developers only need to create its instance with the required parameters on the form where the list is required, and the rest is done automatically. This recipe will show the basic principle of how to create selected/available lists. 

We will add an option for assigning customers to buyer groups in the Buyer groups form in the Inventory management module. Below you can see the step by step process for the above requirement. 

 1. In the AOT, create a new table named InventBuyerGroupList. Do not change any of the properties as this table is for demonstration only. 

 2. Add a new field to the table with the following properties (click on Yes if asked to add a new relation to the table): Type:String,Name:GroupId,EDT:ItemBuyerGroupId. 

 3. Add another field to the table with the following properties: Type:String,Name:CustAccount,EDT:CustAccount. 

 4. In the AOT, open the InventBuyerGroup form and change the design properties as follows: Set the property of Design NODE as (Style>>Auto). 

 

5. Add a new Tab control with the following properties, to the bottom of the design.Properties of Width and Height should be columnWidth and ColumnHeight. 

 

6. Add a new TabPage control with the following properties to the newly created tab.Set the Name as (BuyerGroups) and Caption as (Buyer Groups). 

 

7. Add another TabPage control with the following properties to the newly created tab.Set the Name as (Customers) and Caption as (Customers). 

 

8. Move the existing Grid control to the first tab page and hide the existing Body group by setting the property:Visible as NO 

 

9. The form should look similar to the following screenshot.

10. Add the following line to the form's class declaration:

SysListPanelRelationTable  sysListPanel;

11. Override the form's init() method with the following code:

public void init()
{
container columns;
#ResAppl
columns = [fieldNum(CustTable, AccountNum)];
sysListPanel = SysListPanelRelationTable::newForm(
element,
element.controlId(
formControlStr(InventBuyerGroup,Customers)),
"Selected",
"Available",

#ImageCustomer,
tableNum(InventBuyerGroupList),
fieldNum(InventBuyerGroupList,CustAccount),
fieldNum(InventBuyerGroupList,GroupId),
tableNum(CustTable),
fieldNum(CustTable,AccountNum),
columns);
super();
sysListPanel.init();
}

12. Override the pageActivated() method on the newly created Customers tab page
with the following code:

public void pageActivated()
{
sysListPanel.parmRelationRangeValue(
InventBuyerGroup.Group);
sysListPanel.parmRelationRangeRecId(
InventBuyerGroup.RecId);
sysListPanel.fill();
super();
}

13. In order to test the list, open Inventory and warehouse management | Setup | Inventory | Buyer groups, select any group, go to the Customers tab page and use the buttons provided to move records from one side to the other. You could also do a double-click or drag-and-drop with your mouse: