Subfile in the Simple Container Layout Floats on the screen

[arora.saurabh]

Hi,

We are trying to create some responsive pages having a Menu, Couple of Graphs and Subfile grid.

There is one program and display file that comes up with the Menu, Logo and the Heading. This screen is then overlay-ed by another program/display file having couple of graphs and subfile grid.

All the widgets align perfectly on execution except the Subfile. Subfile leaves the container (Div) and becomes an independent Div.

Is there a way to control the subfile widget in the Container Layout ??

Thanks,
Saurabh Arora

[Scott Klement]

Are you sure you dragged the subfile into the container, and it showed that it was properly added?

What you're describing sounds like the subfile is not in the layout, but is just sitting on top of it on the screen.

NOTE: You mention overlaying record formats... so it's worth mentioning that in order to be inside the same layout, the widget must also be in the same record format. Widgets in an overlaying format will never be in the same layouts as the widgets from the one it overlays. It's much better to combine the displays into one.

[arora.saurabh]

Hi Scott,

Thank you for your response.

Yes, the subfile was added in a simple container. But the grid properties would not accept the 'em' and '%' for the positioning.

We have a requirement to reuse the menu across the application and therefore would prefer to have a separate display to have the menu.

Even if we combine the widgets in single display file, the subfile would not adjust according to the screen size. This is not the actual problem but in this case if the display size is smaller, it would not display the scroll bars and there is no way to see the complete subfile.

I may not be able to explain well and therefore have attached few files if it helps.

(Just to add: JSON.txt have the 2 display files overlayed and JSON(1).txt have the single display file but the scroll bars missing)

Thanks !!

[Scott Klement]

The grid/subfile widget is not a single HTML element. It is a lot of different elements (mostly DIV's) that are drawn together to make up all of the effects that a grid can do. It is quite complex, but that is needed for all of the things it does, like resizable columns, movable columns, etc.

For everything to be drawn effectively, it must be positioned/sized in pixels. That is a known limit of the grid widget.

The grid does have an "expand to layout" property that can be used to make it expand to the size of the layout that it is inside.

Depending on what you're doing, you might consider coding HTML elements, possibly using the EJS templating system that we recently added, instead. This will give you a lot more flexibility, at the cost of not having all of our features.

[arora.saurabh]

The "expand to layout" property on the grid works well and would handle most of the concerns.

Just a quick question on the scroll bars not appearing if the single display is used. I would expect the horizontal and vertical scroll bars to appears as soon as the display size is reduced to an extent that the screen doesn't fit.

Are we missing something in the design ?

Thanks !!

[Scott Klement]

Just a quick question on the scroll bars not appearing if the single display is used. I would expect the horizontal and vertical scroll bars to appears as soon as the display size is reduced to an extent that the screen doesn't fit.

Sorry, I'm not familiar with this problem. Are you referring to the scrollbar on the grid or the scrollbar on the layout?

[arora.saurabh]

Scroll bar on the layout doesn't appear even in case the size of the display is reduced.

Thanks !!

[Scott Klement]

The layout is just a <div> element. The "overflow x" and "overflow y" properties correspond to CSS styles of the same name. So none of our code is involved, there.. you just set the overflow properties to enable scrollbars when the browser thinks they are appropriate.

I don't see why the size of the display should matter, though. They scroll when the data inside them doesn't fit, not when the display size changes. The display viewport itself should become scrollable when the page doesn't fit.