hello, I have a Grid application, which has a Search module as initial, so the grid loads in an Iframe.
My issue is that if I don’t set a height for the iFrame, I will have 2 scrollbars, one inside the iframe, to scroll the records (200+ records), and one outside, on the main application, to scroll the Iframe.
I can solve this by putting a set height for the iFrame, that is smaller that the viewport of the screen, so for a 1080p screen, around 760px (counting browser bar and windows menu bar).
This makes the iframe display in the initial screen and as it is smaller than the viewport, the outside scrollbar disappears, so I only have the scrollbar inside the iframe.
But this solution is not ideal, what I would like is the same result as setting the height of the iframe to 5000px, this makes it huge, but all the records can fit in it, so inside the Iframe I wont have any scrollbar but just a standard scrollbar on the main window.
I want this because the inner scrollbar of the iframe looks bad, it moves the iframe to the left, and it s not completely on the right of the browser.
I need a way to make it that the iFrame has dynamic height depending on the amount of records!
Setting 5000 px is not a solution, because when I only have 10 records for example, I would still have a 5000px iframe.
I have a solution but I dont know how to implement it,
if you add with chrome inspect tool, on the <iframe> tag, this part:
<iframe src="xxxx" onload="this.style.height=this.contentDocument.body.scrollHeight +'px';"> </iframe>
the “onload” part fixes the issue!!
But how do I implement this piece of code to be added to each Iframe my apps generate?
or, are there native solutions in scriptcase?