popup(atlas_Core) DG2 column header with issue after update

0
I've upgraded to 11.9 and now the headers get forced into a position where they are overlapping.As soon as you resize the window they get reset and change as expected.in the image below you can see the opening state (left) vs the expected state (right).There is no custom css applied to any element.Anybody with an idea as to how to resolve this?
asked
3 answers
0

Apparently a lot of files were either missing or having a smaller file size than those of a fresh app in the appropriate version of Studio Pro. I've tried manually importing said files into the project, but this didn't fix the issue. I've added the following css to the popup window: .dg2-popup-header-fix {

.widget-datagrid-grid {

--widgets-grid-template-columns-head: var(--widgets-grid-template-columns) !important;

}

This 'fixed' the issue

answered
0

Hi,


This is a known behavior after upgrading to 11.9, especially with Data Grid 2 inside popups. What you’re seeing is a layout calculation issue where the grid headers are rendered before the container size is fully stabilized.

That’s why resizing the window fixes it — it forces a reflow and recalculates column widths correctly.

Root cause

  • DG2 calculates column widths on initial render
  • In a popup, the container is not fully sized at that moment
  • Result: headers overlap until a resize triggers recalculation

1. Trigger a re-render on page load

Wrap the popup content in a container and trigger a refresh via nanoflow on page load.

For example:

  • Add a nanoflow on page load
  • Add a small delay (optional via JS action)
  • Refresh the Data Grid 2 context object

This forces DG2 to recalculate layout properly.

2. Use “Auto height” carefully / set fixed height

If the grid is inside a container with dynamic height:

  • Try setting a fixed height or consistent container size
  • Avoid nested scroll containers

3. Add a small CSS workaround (force reflow)

You can force proper rendering with:


.mx-datagrid2 {
    width: 100%;
}

Or ensure parent container:


display: block;
width: 100%;

4. Avoid hidden/conditional containers on load

If the popup or grid is initially hidden and then shown:

  • DG2 may calculate width incorrectly
  • Ensure it is visible when rendered

5. Upgrade Atlas / widgets

Make sure:

  • Atlas Core is up to date
  • Data Grid 2 widget is latest version

Some layout issues were addressed in newer patches.

This is not a configuration mistake but a render timing issue with DG2 in popups. The most reliable fix is to trigger a refresh/reflow after page load or ensure the container has a stable size during initial render.


answered
0

Hi, did you update DataWidgets to the latest version? We saw similar behaviour but it was fixed with the latest release. Unfortunately that release can show small horizontal scrollbars which disappear when the grid is scrolled, that will be fixed in the next release

answered