Oct 23, 2009, 7:11 AM
[CLOSED] [1.0] FormPanel repaint issue
When the below code sample is viewed in IE7, the bottom part of the FormPanel doesn't expand to fit the width of the screen.
I had the same problem with the header, but I fixed that with the "frmActionType.header.repaint()" code that's fired on the AfterLayout listener of the ViewPort. There doesn't appear to be a "footer" property of the Form, so how can I fix the width issue? Also, is there a permanent fix that can be implemented for this, rather than having to call the "repaint()" method?
Thanks
I had the same problem with the header, but I fixed that with the "frmActionType.header.repaint()" code that's fired on the AfterLayout listener of the ViewPort. There doesn't appear to be a "footer" property of the Form, so how can I fix the width issue? Also, is there a permanent fix that can be implemented for this, rather than having to call the "repaint()" method?
Thanks
<%@ Page Language="C#" %>
<%@ Import Namespace="Ext.Net.Utilities" %>
<%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:Store
ID="strActionTypes"
runat="server">
<Reader>
<ext:JsonReader IDProperty="ActionTypeID">
<Fields>
<ext:RecordField Name="ActionTypeID" Type="Int" />
<ext:RecordField Name="ActionTypeName" Type="String" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:Viewport ID="vptMain" runat="server">
<Content>
<ext:ColumnLayout ID="cmlMain" runat="server" FitHeight="true">
<Columns>
<ext:LayoutColumn ColumnWidth=".45">
<ext:GridPanel
id="grdActionTypes"
runat="server"
StripeRows="true"
Title="Action Types"
StoreID="strActionTypes"
Frame="true"
TrackMouseOver="true"
AutoExpandColumn="colActionTypeName"
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 Action Type">
<ToolTips>
<ext:ToolTip ID="ttAddActionType" runat="server" Html="Create a new Action Type record" />
</ToolTips>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<ColumnModel ID="ColumnModel2" runat="server">
<Columns>
<ext:RowNumbererColumn />
<ext:Column ColumnID="colActionTypeName" DataIndex="ActionTypeName" Header="Action Type"></ext:Column>
</Columns>
</ColumnModel>
<BottomBar>
<ext:PagingToolBar
ID="grdPager"
runat="server"
PageSize="20"
StoreID="strActionTypes"
EmptyMsg="No items found">
<Items>
<ext:ToolbarSeparator ID="ToolbarSeparator1" runat="server"></ext:ToolbarSeparator>
<ext:Label ID="lblSearch" runat="server" Text="Search:"></ext:Label>
<ext:TextField ID="txtSearch" Width="100" runat="server" MaxLength="100" EnableKeyEvents="true">
<Listeners>
<KeyPress Handler="if (e.getKey() == Ext.EventObject.ENTER){e.preventDefault(); #{btnSearch}.fireEvent('click', this);}" />
</Listeners>
</ext:TextField>
<ext:Button ID="btnSearch" Icon="Zoom" runat="server">
<ToolTips>
<ext:ToolTip ID="ToolTip3" runat="server" Html="Search"></ext:ToolTip>
</ToolTips>
</ext:Button>
</Items>
</ext:PagingToolBar>
</BottomBar>
<LoadMask ShowMask="true" />
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true">
</ext:RowSelectionModel>
</SelectionModel>
</ext:GridPanel>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".55">
<ext:FormPanel
Title="Action Type Details"
Frame="true"
id="frmActionType"
BodyStyle="padding: 6px; border: 1px solid #99bbe8;"
runat="server"
LabelWidth="160">
<TopBar>
<ext:Toolbar ID="tlbPlatform" runat="server">
<Items>
<ext:Button ID="btnSave" runat="server" Text="Save" Icon="Disk">
<ToolTips>
<ext:ToolTip ID="ToolTip1" runat="server" Html="Save changes to this record" />
</ToolTips>
</ext:Button>
<ext:Button ID="btnDelete" Text="Delete" runat="server" Icon="Delete">
<ToolTips>
<ext:ToolTip ID="ToolTip2" runat="server" Html="Delete this record" />
</ToolTips>
</ext:Button>
<ext:ToolbarFill ID="ToolbarFill3" runat="server"></ext:ToolbarFill>
<ext:Button ID="btnToggleModifiedFlag" Icon="Tag" runat="server">
<ToolTips>
<ext:ToolTip ID="ToolTip4" runat="server" Html="Click to toggle between Created and Modified details" />
</ToolTips>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<Defaults>
<ext:Parameter Name="Anchor" Value="100%"></ext:Parameter>
<ext:Parameter Name="AllowBlank" Value="false" Mode="Raw"></ext:Parameter>
</Defaults>
<Items>
<ext:Hidden runat="server" ID="hidActionTypeID" DataIndex="ActionTypeID"></ext:Hidden>
<ext:TextField
AllowBlank="false"
id="txtActionTypeName"
runat="server"
MaxLength="255"
BlankText="'Action Type' is required."
FieldLabel="Action Type"
DataIndex="ActionType">
</ext:TextField>
</Items>
<BottomBar>
<ext:StatusBar ID="StatusBar1" runat="server" DefaultText="Ready">
<Plugins>
<ext:ValidationStatus ID="ValidationStatus2" runat="server" FormPanelID="frmActionType" ValidIcon="Accept" ErrorIcon="Exclamation" />
</Plugins>
</ext:StatusBar>
</BottomBar>
</ext:FormPanel>
</ext:LayoutColumn>
</Columns>
</ext:ColumnLayout>
</Content>
<Listeners>
<AfterLayout Handler="frmActionType.header.repaint();" Single="true" />
</Listeners>
</ext:Viewport>
</form>
</body>
</html>
