Support Article

Navigation is slow between tabs in a Tab type Layout group

SA-41733

Summary



User upgraded to Pega 7.2.2 from Pega 7.1.8 and reported that the navigation between tabs is slow when using tab-arrow for left tab navigation and right tab navigation.

Some times the navigation doesn't work even after 3-4 clicks. In Pega 7.2.2 due to changes in css for layout group, they are seeing tab-arrow for navigation between tabs when the number of tabs goes beyond 10-15.

But in pega 7.1.8, the tabs used to appear in two rows. User want to know if there is a way to revert back to the behavior observed in Pega 7.1.8 before upgrade i.e they want to see the tabs in two rows instead of tab-arrow for left and right tab navigation.


Error Messages

Not Applicable


Steps to Reproduce

  1. Create a section with Tab type layout group.
  2. Add 15-20 tabs in the layout group.
  3. Run the application to verify the section. A tab-arrow appears for left and right navigation between tabs. When you click on the arrow to navigate between the tabs, the transition of control is some times slow and most of the times it gets stuck, that is, the navigation doesn't move at all.


Root Cause



An issue in the custom application code/rules is identified as root cause for the issue.

In Tab Type Layout group, if the width of the Layout group is greater than the viewport then automatically arrows will be shown for navigation.

This feature is called "Tab Overflow", which was introduced in Pega 7.2.2. This new behavior is not related to any issue in the product.The transition between tabs on clicking of the tab arrows was slow due to too much of data being presented on screen in each of the tabs.

Resolution



Perform the following local-change:

Enable "Stretch For Tabs" option in Layout group property configuration to display all the tabs in a layout group instead of showing the tab-arrow for navigation.
Suggest Edit

Published November 17, 2017 - Updated October 8, 2020

Have a question? Get answers now.

Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.