Customizing Hierarchical Grid Common (Project WBS Grid) Dynamics 365

Hello DAX DEV,

I recently was given a task which the purpose was to disable some fields, buttons and change the calculation of the Project WBS Hierarchical Grid Control in Dynamics 365.

With the requirement of using Extensions and Overlaying and not customizing any SYS objects, the following topics explain a little bit about the necessity, its implications and how it turned out to be possible.

The WBS form Path is: Project management and accounting > Projects > All projects > PLAN (Button Group) > Work breakdown structure (Menu item button)

WBS Original

The highlighted control is not a regular Grid, it is a Hierarchical Grid Common. After debugging it a lot, I found out that the grid is almost entirely controlled by a JavaScript file mentioned on the properties of this Grid control:

Property box Original

Note issue#1: JS path property cannot be altered on this form nor on a form extension, It’ll always pop up this warning and cancel the operation:

errorJS

Note issue#2: It is impossible to overwrite the “Object” Property on a display menu item extension, It’ll always pop up this warning:

MenuItemDisplayError

Scenario difficulties:

  1. As mentioned, it is a requirement that all the changes are limited to new objects and/or extensions only, we cannot customize existing elements from MS Models.
  2. All Grid calculations happen on this JavaScript file, not on any X++ based Object.
  3. The Proj WBS Form and its extension do not allow any change to the property  “JavaScript Extension file” on the Hierarchical Grid Common  Issue#1.
  4. It is impossible to overwrite the Object Property of a display Menu Item Extension Issue#2.
  5. Javascript files are stored in the Application explorer as Resources and Microsoft did not release yet the functionalities of extensions or overlaying for Resources.

Solution :

  1. Duplicate the JS file,  with the same code but with a different name.
    • Further changes to the behavior of the Grid will be manipulated in this JS file.
  2. Duplicate the form & Create a new Menu Item Display for it.
    • In this new form duplicated from “ProjWorkBreakdownStructure” , find the Hierarchical Grid and Change its property “Javascript Extension Files” to your new JS resource name.
      • Issue 1, Only by duplicating the form AX will allow the user to alter the “Javascript Extension Files” property of the Hierarchical Grid Common control.
      • Issue 2, By default, the property object cannot be altered on a Display Menu Item extension, so a new menu item is needed to access the duplicated form.
  3. Overlay the Init Method of the original Sys Form
    • Create a new “FormHelper” class, and overlay the init Method from Form ProjWorkBreakdownStructure, then use X++ to get the args object from the Original Form execute the form methods run* and close, Then open the menuItem of the duplicated form and send the original args object to it.
      • (*) It is indispensable to execute the method Run before closing the original form, so AX won’t crash.
class ProjWorkBreakdownStructureFormHelper
{
/// <summary>
/// Method closes ProjWorkBreakdownStructure and opens the
/// custom form newProjWorkBreakdownStructure with the same args.Record()
/// </summary>
/// <param name="args"></param>
[PostHandlerFor(formStr(ProjWorkBreakdownStructure), formMethodStr(ProjWorkBreakdownStructure, init))]
public static void ProjWorkBreakdownStructure_Post_init(XppPrePostArgs _args)
{
Object formRun = _args.getThis();
Args args = formRun.args();
formRun.run();
formRun.close();
new MenuFunction(menuItemDisplayStr(newProjWorkBreakdownStructure),MenuItemType::Display).run(args);
}
}
  1. Alter the new JS file to perform the changes needed. In my case they were:
    • Removing 3 fields from the GRID: 
      • Around line 1300 of the JS file, there is a function called “getColumns” where the object “columnsArray” is located. This object can be manipulated and controls the Columns visibility and order

WBSCollumnsArray

    • Removing 2 Buttons from Grid’s Action pane:
      • Close to line 1500 of the JS file there is a function called  “_initToolbarContainer” that receives an object “container”, this container controls the buttons visibility and order.

wbsToolbars

    • Altering the Grid’s calculation on field changed: 
      • Approximately at line 525 of the JS file, there is a function called “cellValueChanged” that is executed whenever there’s a data modification on any field of the Grid, This function has a switch case with one separated case for each field. All the data calculation and grid responsiveness happen here, so any change in the logic needs to be done here. 

WBSCalculationJS1

      • Perform the change on the Grid’s calculation by manipulating the new JS file:
      • Some of the cases of the switch case trigger a calculation of values. To do the required modifications it was necessary to change those cases, comment some specific lines and call the newly created function “calcResourceNum” that unifies the calculation with the expected calculation rule.

WBSCalculationJS2

After altering the JS file, the behavior of the Grid was exactly as expected, the unnecessary fields and buttons were removed, and the new calculation rule was placed.

Developer important note – Minor Threat to MS HotFixes: 

There is a drawback to this solution, from my perspective it is currently insoluble, that is: Because it was impossible to manipulate the JS path property on the Form Extension Issue#1 and it is also impossible to alter the Object Property of a Display menu Item Issue#2, It was necessary to create a form duplicate and a PostHandler to catch the regular form Init method, close it and open the duplicate Form by code with the same arguments.

With this solution in place, if Microsoft releases a new hotfix that includes changes to this form, at first, the change will not take place automatically. It will only take place if the HF changes are also replicated manually to the duplicated form or after removing the old duplicate and creating a new duplicate with the same name, Doing step 2 of the solution again to catch up with the latest MS HotFix changes to this form.

Follow us and get exclusive AX DEV content weekly

Thank you for reading, I hope it had been helpful,
Felipe Nogueira