PDA

View Full Version : [CLOSED] GridPanel doesn't automatically resize using 'fit' layout and IE9



rusty
Oct 12, 2012, 11:24 PM
I have a GridPanel inside of a Panel where the Panel is using a Layout="fit". The GridPanel has ForceFit=true. Works fine on Firefox and Chrome. When the window is resized to a larger size on IE9, the Panel and GridPanel respond correctly by re-laying out the contents. But, when the window is made smaller, data clips because it isn't executing the re-layout.

The GridPanel is the only 'Item' of the Panel.

I can produce an example if it helps.

geoffrey.mcgill
Oct 13, 2012, 12:46 AM
Is this the same problem posted here...

http://forums.ext.net/showthread.php?21501-GridPanel-columns-adjust-their-widths-correctly

Daniil
Oct 15, 2012, 8:07 AM
Hi,

If it is another problem, then yes, please provide a sample to reproduce.

rusty
Oct 15, 2012, 4:00 PM
The code is the same as the other problem, but the issues are different. In the other post, I can't resize the columns correctly. In this post, the Grid isn't resizing correctly with the window (specifically, when I make the browser window smaller), only in IE. I posted a simplified example on the other topic, but unfortunately, simplifying the code made this problem disappear. :( I still have the problem in a more complex case, but I'll have to work more on a simple failure example.

Thanks for now.

Daniil
Oct 15, 2012, 5:28 PM
Ok, thank you for the details.

Seems I can't see a proper layout configuration which would manage the GridPanel size on window resizing.

Here is a simplest working case.

Example

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
Store store = this.GridPanel1.GetStore();
store.DataSource = new object[]
{
new object[] { "test1", "test2", "test3" },
new object[] { "test4", "test5", "test6" },
new object[] { "test7", "test8", "test9" }
};
store.DataBind();
}
}
</script>

<!DOCTYPE html>

<html>
<head runat="server">
<title>Ext.NET v2 Example</title>
</head>
<body>
<ext:ResourceManager runat="server" />

<ext:Viewport runat="server" Layout="FitLayout">
<Items>
<ext:GridPanel ID="GridPanel1" runat="server">
<Store>
<ext:Store runat="server">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="test1" />
<ext:ModelField Name="test2" />
<ext:ModelField Name="test3" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:Column runat="server" Text="Test1" DataIndex="test1" Flex="1" />
<ext:Column runat="server" Text="Test2" DataIndex="test2" />
<ext:Column runat="server" Text="Test3" DataIndex="test3" />
</Columns>
</ColumnModel>
</ext:GridPanel>
</Items>
</ext:Viewport>
</body>
</html>


More layout examples you can find here:
http://examples2.ext.net/#/search/layout

If you can provide a mockup of required layout, we could suggest something.

rusty
Oct 15, 2012, 8:02 PM
I believe I figured out the problem. My <!DOCTTYPE> tag was not the first html tag -- it was following the <script> stuff. This caused IE to go into "Quirks" mode. Moving the tag up above the <script> tag solved the problem.

Yay!

Daniil
Oct 16, 2012, 5:55 AM
Yes, I think that doctype declaration must go before the <html> tag.