Article Details
Id:16274
Product:finPOWER Connect
Type:NEW
Version:3.02.01
Opened:12/08/2019
Closed:22/08/2019
Released:12/09/2019
Job: J022736
High Importance
Breaking Change

HTML Widgets; Grids; Changes to behaviour relating to "sticky" headers

Sticky headers are where a grid's rows scroll but the header stays in place, e.g., if you have a vertical list of Accounts which causes scrollbars to appear, without sticky headers, the grid's header row would disappear as you scrolled down.

The way sticky headers are implemented in HTML Widget grids has been updated to take advantage of the reasonably ubiquitous CSS position: sticky functionality.

However, Internet Explorer (which is used for displaying HTML Widgets inside of finPOWER Connect (desktop version) does not support this hence headers will no longer "sitck" in Internet Explorer.

The following changes have been made:

  • The "stickyHeader" start-up option for widget.UI.Grid is now null and which default based upon whether the Web Browser supports this natively (Internet Explorer does not)
    • NOTE: The headers may not appear to "stick" if the grid is not enclosed in an element which restricts its size.
  • Absolute positioning is no longer used meaning that it is a lot easier to implement screen layouts where the grid is not taking up the entire screen.
  • A new "docked" start-up option for the grid has been added. This is null by default and, if unspecified, will default to true if the "stickyHeader" start-up option is true.
    • This maintains backward compatibility with existing Widgets since it caused the grid to be absolutely positioned based on its parent element.

NOTE: Although this is a potentially breaking change and will affect Internet Explorer (including HTML Widgets displayed within finPOWER Connect desktop), it has many compatibility and performance benefits and is being applied to both HTML Widgets and finPOWER Connect Cloud.