User Interface

Improvements To Tree Grid View in Openbravo

Hierarchical data is one of the key pieces of information in any Enterprise Application. Be it the list of companies under a major group or the position hierarchy of a company, the visual representation of the hierarchical data is of key importance in understanding the business process of a company. Openbravo ERP handles this kind of data using the Tree Grid View Feature. You can go to the tree grid view for your window, using the icon provided below. Note that it is enabled only for those windows where tree grid view is enabled. For example, Organization window, or Menu window (available only for System Administrators).

Administrator img

 

Prior to Openbravo 3.0PR14Q2, tree grids were displayed all in one in a pop up (image below). The tree items could be rearranged from the pop up and collapsed / expanded. There were a few drawbacks with this approach:

  • Only the identifier data could be shown in the tree and the other details about the tree item were not visible.
  • Filtering was not possible.
  • Performance was affected with a higher  number of nodes, since all the nodes were generated and rendered at once.

Tree view screenshot

From 3.0PR14Q2, the tree view has been re factored using the Tree Grid component of Smartclient. Using this approach the normal grid view could be modified to show the tree grid view (image below). The main advantage here is the ease of defining new trees and also the ability to filter them. For the performance geek, since it follows the standard grid pattern, only the first level parent nodes are loaded at first, and then as each root node is expanded the child nodes are fetched. Also when filtering, immediate parents are retained so that the hierarchy is clearly visualized.

menu screenshot

menu 2 screenshot

Also from a technical development stand point, before 3.0PR14Q2, if we wanted to enable trees for our custom windows, we had to make some changes to the Openbravo core module. For information on how it was achieved previously, refer here. This process has been modified and now trees can be enabled for new windows, without making any changes to the Openbravo core. Also, custom rules are now supported  for deciding the hierarchy of the records. Earlier it was possible only to use ‘Summary Level’ flag at the record level to define the Hierarchy. For more information on creating trees using the new interface, refer to this wiki 

Here is a short comparison on the Improvements to Tree Grid View.

Before 3.014PRQ2 From 3.0PR14Q2
Tree rendered as a popup Tree rendered similar to standard grid
Only identifier shown All the grid columns are shown
Filtering was not possible Filtering is possible with the parent node retained
All nodes were rendered at once causing performance
issues if there were lots of items
Only the first level parent nodes are rendered at first and the children are loaded only if the parent node is expanded
Custom Trees are not possible Custom Trees are possible

A small brief on the tree structures supported in the latest model from this wiki.

AD Tree Structure

If this structure is used, the information needed to handle the hierarchy of the tree data will be stored internally by Openbravo in the AD_Tree and AD_TreeNode tables.

Link to Parent Tree Structure

This structure should be used if the table contains a column that represents the parent node of the record. For instance, consider a table called ´Employee´ that has a column called ´reportsTo´. This column points to the employee who the current employee must report to.

Custom Tree Structure

There may be other cases where the information needed to handle the hierarchy is stored within the table but by means other than a column pointing directly to the parent node. For instance, this is the case of the AD_Tab table, where the hierarchy of the tabs is defined using the seqNo and tabLevel columns. In this case, the user has to provide a manual datasource to handle the tree hierarchy.

Tree Selectors

Also since Q2, trees can be also used as selectors in the normal windows (image below). For tree selectors to work, the tree views have to be defined. For more information on creating tree selectors refer to this wiki.

department - IT screenshot

 

Updating your current custom development involving trees to the latest model following the wiki will be a breeze. We will share our thoughts on more interesting topics related to Openbravo technical development in the coming weeks.

Previous post

Dissecting the application scripting architecture of Openbravo ERP 3.0

Next post

Dissecting and Customizing the Toolbar Component in Openbravo ERP

3 Comments

  1. Andrea Feraco
    January 7, 2015 at 11:06 PM

    When following the “wiki” link referred at the point about creating trees (http://wiki.openbravo.com/wiki/How_to_Define_a_Table_as_a_Tree), you land to a page with no content. Could you please check, I am interested.
    Thank you

  2. Shankar Balachandran
    January 8, 2015 at 2:21 PM

    Hi Andrea,
    The link seems to be working now, can you check it?

  3. […] the technical blog series where we looked at the Improvements to the Tree Grid View in Openbravo, now we shall look at the internal architecture of the Toolbar in Openbravo and how other modules […]

Leave a reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>