Despite the COVID-19 outbreak, our team continues operating at full speed. We are always here to support and answer all your questions.

Feel free to reach out by filling this quick form.

Fill the form
Get Free Trial

Flex Monster Popup resize issue

Tanushree asked on January 13, 2021

We are using Flex Monster 2.8 version and embedding it inside a re-sizable window using js-grid.
We also have a business requirement not to use double vertical scrolls as such I have disabled the outer vertical scroll in Flex monster grid.
The downside of this is when I shrink the window containing FM grid and open Fields popup, the popup always moves at the top and overrides any custom css.
Due to the popup shifting at the top, header div which lies outside the Flex Monster grid disappears.
The only way the popup doesn’t move at the top is by using:
.fm-ui-popup, .fm-popup {
position: fixed !important;
transform: translate(-50%, -50%);
However, if the window size is less than the popup dimensions, the popup is shown at a fixed position outside the window which we don’t want.
The only way the header is retained is by enabling the outer vertical scroll which we don’t want in our case.
I could also replicate this issue in the FM 2.8 JsFiddle by disabling the outer html vertical scroll :
Any help will be highly appreciated.

6 answers

Illia Yatsyshyn Illia Yatsyshyn Flexmonster January 14, 2021

Thank you for reaching out to us.
Please note that the component is not designed in the way it allows disabling the vertical scroll. If it affects other aspects of the component, you may need to implement custom workarounds for this. For example, you can develop a custom Field List that would be displayed accordingly to your needs.
Our team will be happy to assist with the workaround for your case. Still, we did not manage to reproduce the problem on our side.
Therefore, we want to ask you to modify the provided JSFiddle so that the problem can be observed.
We are looking forward to hearing from you.
Kind regards,

Tanushree January 14, 2021

Thanks for reaching out to me.
Please use the following fiddle:
Alternatively steps to replicate the issue are:
html {
overflow: hidden;}
After the the outer vertical scroll is not shown.
Now if you try to resize the screen (eg: by reducing height) then the popup always shifts at the top and when popup is cancelled, the icons header is chipped off.
Let me know if this helps in replicating the design issue.

Illia Yatsyshyn Illia Yatsyshyn Flexmonster January 15, 2021

Thank you for providing us with an example.
Our team needs some time to investigate this issue.
We will get back to you in the nearest time.
Kind regards,

Illia Yatsyshyn Illia Yatsyshyn Flexmonster 5 days ago

The provided sample helped to find the root of this issue.
Our team will research this issue for possible solutions and get back to you ETA Feb 8.
Feel free to contact us in case other questions arise.
Best regards,

Tanushree 5 days ago

Thanks Illia for coming back.
Currently our Flex Monster grid is embedded inside a re-sizable window.
Is there a way to shrink the popup when the window dimensions are significantly reduced?
Currently all popups in FM 2.8 version are fixed size.

Illia Yatsyshyn Illia Yatsyshyn Flexmonster 3 days ago

Thank you for your question.
We want to confirm that the pop-up windows’ dimensions are fixed in Flexmonster. Currently, it is not possible to adjust their dimensions.
We suggest developing custom UI controls that would resize accordingly to the window’s dimensions.
All the built-in component’s and the Toolbar’s pop-up windows use our open API. It means you can use the listed methods to create the desired UI controls.
We hope it helps.
Please contact us in case other questions arise.
Kind regards,

Please login or Register to Submit Answer