Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[HxContextMenuGridColumn] Using HxContextMenu in HxGrid causes extra scrollbar to apear when dropdow is larger then the grid #898

Open
TPIvan opened this issue Oct 3, 2024 · 10 comments
Labels
enhancement New feature or request

Comments

@TPIvan
Copy link
Contributor

TPIvan commented Oct 3, 2024

Using HxContextMenu within HxGrid in responsive mode causes an extra vertical scrollbar to appear when the context menu dropdown is higher than the grid itself.

Observed behavior:
The grid displays an unnecessary vertical scrollbar when the context menu dropdown overflows the grid's height.
image
Expected behavior (achieved with <style type="text/css">.table-responsive {overflow-x:initial;} </style>):
The grid should not display an additional scrollbar, allowing the context menu dropdown to expand freely without affecting the grid's vertical scrolling.
image
Steps to Reproduce:

  1. Follow the example in the Havit.Blazor documentation for HxGrid with context menus (https://havit.blazor.eu/components/HxGrid#context-menu).

  2. Set the PageSize property of the HxGrid to 1.

     <HxGrid @ref="gridComponent" TItem="EmployeeDto" DataProvider="GetGridData" PageSize="1" Responsive="true">
    

In my real situation, I have two rows in the grid and three rows in the context menu.

The problem is the same as described in issue #449, and the solution should follow the approach outlined in #450 (comment).
The problem is that it appears that there is currently no way to apply AdditionalAttributes to the dropdown toggler. I believe the correct solution would be for

    data-bs-popper-config='{"strategy":"fixed"}' 

to be added by HxGrid when Responsive="true".

@crdo
Copy link
Member

crdo commented Oct 3, 2024

This is something that should have been addressed in the latest release by adding PopperStrategy parameter to the HxContextMenu.
Are you on the latest version?

@crdo
Copy link
Member

crdo commented Oct 3, 2024

... we decided not to use attribute splatting for performance reasons as unlike the dropdowns or form controls, the context menu is usually rendered in a loop.

@TPIvan
Copy link
Contributor Author

TPIvan commented Oct 3, 2024

I have version 4.6.15 (installed yesterday). Applying the strategy through the attribute feels more like a workaround than a proper solution to me.

@crdo
Copy link
Member

crdo commented Oct 3, 2024

And what would be a proper solution to you?

@crdo
Copy link
Member

crdo commented Oct 3, 2024

Should you be interested, the discussion on this topic is here #844

@TPIvan
Copy link
Contributor Author

TPIvan commented Oct 3, 2024

I reviewed #844. In my opinion, the strategy should be controlled by the Responsive property without requiring any additional attributes, as "absolute" only works well in ideal conditions.

@TPIvan
Copy link
Contributor Author

TPIvan commented Oct 3, 2024

I currently need to apply strategy:fixed even if the dropdown is not in grid because of issues with scrollbars and partial visibility, but I have a complex form with independently scrollable sections.

@TPIvan
Copy link
Contributor Author

TPIvan commented Oct 7, 2024

I can confirm that the issue can be resolved using the PopperStrategy attribute in the latest version. However, I still believe that this should be addressed within the grid component itself. Please feel free to close this issue if you disagree.

@hakenr
Copy link
Member

hakenr commented Oct 9, 2024

@crdo Can we add the PopperStrategy to our demo and/or related instructions? Or is this still an "it depends" scenario, where you'd only want this strategy for certain HxGrid context menus?

@hakenr
Copy link
Member

hakenr commented Oct 15, 2024

Based on the internal discussion: If feasible (without impacting performance), we should set the new PopperStrategy as the default for context menus within HxGrid.

  • Use the existing CascadingValue if possible.
  • Otherwise, add PopperStrategy to the demos.

@hakenr hakenr added the enhancement New feature or request label Oct 15, 2024
@hakenr hakenr added this to the Priority 2 - Normal milestone Oct 15, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

3 participants