Jan 25, 2010, 4:22 AM
[CLOSED] [1.0] Various resize problems and ValidationStatus not showing
In the below example, I've spotted the following bugs:
1) The PagingToolbar disappears when the window is resized smaller (in both IE6 and IE7)
2) StatusBar disappears when the window is resized smaller, and doesn't reposition correctly when the window is maximised again (in both IE6 and IE7)
3) The ValidationStatus errors list isn't shown when clicking on the "Form has errors..." text (in both IE6 and IE7)
4) The header and footer of the FormPanel isn't drawn correctly (they don't fit the width of the right-hand column. Before, I added the following listener to the ViewPort to resolve this (in IE7 only):
Dan
1) The PagingToolbar disappears when the window is resized smaller (in both IE6 and IE7)
2) StatusBar disappears when the window is resized smaller, and doesn't reposition correctly when the window is maximised again (in both IE6 and IE7)
3) The ValidationStatus errors list isn't shown when clicking on the "Form has errors..." text (in both IE6 and IE7)
4) The header and footer of the FormPanel isn't drawn correctly (they don't fit the width of the right-hand column. Before, I added the following listener to the ViewPort to resolve this (in IE7 only):
<AfterLayout Handler="FormPanel1.el.repaint();" Single="true" />
Code:<%@ 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)
{
this.Store1.DataSource = new object[]
{
new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" },
new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, "9/1 12:00am" },
new object[] { "AT&T Inc.", 31.61, -0.48, -1.54, "9/1 12:00am" },
new object[] { "Boeing Co.", 75.43, 0.53, 0.71, "9/1 12:00am" },
new object[] { "Caterpillar Inc.", 67.27, 0.92, 1.39, "9/1 12:00am" },
new object[] { "Citigroup, Inc.", 49.37, 0.02, 0.04, "9/1 12:00am" },
new object[] { "E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28, "9/1 12:00am" },
new object[] { "Exxon Mobil Corp", 68.1, -0.43, -0.64, "9/1 12:00am" },
new object[] { "General Electric Company", 34.14, -0.08, -0.23, "9/1 12:00am" },
new object[] { "General Motors Corporation", 30.27, 1.09, 3.74, "9/1 12:00am" },
new object[] { "Hewlett-Packard Co.", 36.53, -0.03, -0.08, "9/1 12:00am" },
new object[] { "Honeywell Intl Inc", 38.77, 0.05, 0.13, "9/1 12:00am" },
new object[] { "Intel Corporation", 19.88, 0.31, 1.58, "9/1 12:00am" },
new object[] { "International Business Machines", 81.41, 0.44, 0.54, "9/1 12:00am" },
new object[] { "Johnson & Johnson", 64.72, 0.06, 0.09, "9/1 12:00am" },
new object[] { "JP Morgan & Chase & Co", 45.73, 0.07, 0.15, "9/1 12:00am" },
new object[] { "McDonald\"s Corporation", 36.76, 0.86, 2.40, "9/1 12:00am" },
new object[] { "Merck & Co., Inc.", 40.96, 0.41, 1.01, "9/1 12:00am" },
new object[] { "Microsoft Corporation", 25.84, 0.14, 0.54, "9/1 12:00am" },
new object[] { "Pfizer Inc", 27.96, 0.4, 1.45, "9/1 12:00am" },
new object[] { "The Coca-Cola Company", 45.07, 0.26, 0.58, "9/1 12:00am" },
new object[] { "The Home Depot, Inc.", 34.64, 0.35, 1.02, "9/1 12:00am" },
new object[] { "The Procter & Gamble Company", 61.91, 0.01, 0.02, "9/1 12:00am" },
new object[] { "United Technologies Corporation", 63.26, 0.55, 0.88, "9/1 12:00am" },
new object[] { "Verizon Communications", 35.57, 0.39, 1.11, "9/1 12:00am" },
new object[] { "Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63, "9/1 12:00am" }
};
this.Store1.DataBind();
}
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:Store ID="Store1" runat="server">
<Reader>
<ext:ArrayReader>
<Fields>
<ext:RecordField Name="company" />
<ext:RecordField Name="price" Type="Float" />
<ext:RecordField Name="change" Type="Float" />
<ext:RecordField Name="pctChange" Type="Float" />
<ext:RecordField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
</Fields>
</ext:ArrayReader>
</Reader>
</ext:Store>
<ext:ViewPort runat="server">
<Content>
<ext:ColumnLayout ID="cmlMain" runat="server" FitHeight="true">
<Columns>
<ext:LayoutColumn ColumnWidth=".5">
<ext:GridPanel
id="grdtest"
runat="server"
StripeRows="true"
Title="Test"
TrackMouseOver="true"
StoreID="Store1"
Frame="true"
StyleSpec="padding-right: 6px;" Stateful="false">
<TopBar>
<ext:Toolbar ID="Toolbar1"
runat="server">
<Items>
<ext:Button
id="btnAdd"
runat="server"
Icon="Add"
Text="Add new record"
ToolTip="Create a new record">
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<ColumnModel ID="ColumnModel2" runat="server">
<Columns>
<ext:RowNumbererColumn />
<ext:Column DataIndex="company" Width="300" Header="Title"></ext:Column>
</Columns>
</ColumnModel>
<BottomBar>
<ext:PagingToolBar
ID="grdPager"
runat="server"
PageSize="20"
StoreID="Store1"
EmptyMsg="No items found">
</ext:PagingToolBar>
</BottomBar>
<LoadMask ShowMask="true" />
</ext:GridPanel>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".5">
<ext:FormPanel
ID="FormPanel1"
runat="server"
BodyStyle="background-color:transparent; border: 1px solid #99bbe8; padding: 6px;"
Frame="true"
Title="Test"
Layout="Form">
<Items>
<ext:TextField
ID="CompanyField"
runat="server"
DataIndex="company"
FieldLabel="Company"
Width="260"
/>
<ext:NumberField
ID="PriceField"
runat="server"
DataIndex="price"
FieldLabel="Price"
Width="260"
/>
<ext:NumberField
ID="ChangeField"
runat="server"
DataIndex="change"
FieldLabel="Change"
Width="260"
/>
<ext:NumberField
ID="PctChangeField"
runat="server"
DataIndex="pctChange"
FieldLabel="PctChange"
Width="260"
/>
<ext:DateField
ID="LastChangeField"
runat="server"
DataIndex="lastChange"
FieldLabel="Last change"
Width="260"
/>
</Items>
<BottomBar>
<ext:StatusBar runat="server" Height="27">
<Plugins>
<ext:ValidationStatus runat="server" FormPanelID="FormPanel1"></ext:ValidationStatus>
</Plugins>
</ext:StatusBar>
</BottomBar>
</ext:FormPanel>
</ext:LayoutColumn>
</Columns>
</ext:ColumnLayout>
</Content>
<Listeners>
<AfterLayout Handler="FormPanel1.el.repaint();" Single="true" />
</Listeners>
</ext:ViewPort>
</form>
</body>
</html>
ThanksDan