Mar 17, 2010, 7:32 AM
Resizing Layout when using Resizable & TextArea Grow
Hi there,
I asked here in past how to work with TextArea Grow and Resizable control.
It was just now that came to my attention that when using those together I can not use something like AutoWith for the TextArea within a FitLayout in a FormPanel.
I mean, it is ok in respect of AutoGrow that my problem was solved, but when I restore down the browser window size or expland an East Region I would like the TextArea resize itself as all the others field do.
Is there a way to accomplish this? I could not make it.
Leo
I asked here in past how to work with TextArea Grow and Resizable control.
It was just now that came to my attention that when using those together I can not use something like AutoWith for the TextArea within a FitLayout in a FormPanel.
I mean, it is ok in respect of AutoGrow that my problem was solved, but when I restore down the browser window size or expland an East Region I would like the TextArea resize itself as all the others field do.
Is there a way to accomplish this? I could not make it.
<%@ Page Language="C#" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!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 runat="server">
<title>Resizable & TextAreaGrow</title>
<style>
.xt-textarea
{
width:70%;
min-width:50%;
}
</style>
</head>
<body>
<ext:ScriptManager runat="server" />
<h1>
Resizable & TextAreaGrow in Markup</h1>
<ext:Panel ID="PanelForm" runat="server" Frame="true" Title="" Icon="ApplicationForm"
MonitorPoll="500" MonitorValid="true" AutoWidth="true" Height="500">
<Body>
<ext:FitLayout ID="FitLayout1" runat="server">
<ext:FormPanel ID="FormPanelDetails" runat="server" Frame="false" Title="" BodyBorder="false"
Border="false" Icon="ApplicationFormEdit" ButtonAlign="Center" Stateful="true"
LabelWidth="70" AutoWidth="true">
<Body>
<ext:FormLayout ID="FormLayout1" runat="server">
<ext:Anchor>
<ext:TextArea ID="TextAreaDescription" runat="server" FieldLabel="Description" GrowMax="200"
Grow="true" AutoWidth="true">
<Listeners>
<AutoSize Handler="#{CustomResizer}.resizeTo(this.getWidth(), this.getHeight());" />
</Listeners>
</ext:TextArea>
</ext:Anchor>
</ext:FormLayout>
<ext:Resizable ID="CustomResizer" runat="server" Element="={#{TextAreaDescription}.el}"
Wrap="true" Pinned="false" Handles="SouthEast" Draggable="false" Dynamic="false">
<Listeners>
<Resize Handler="#{TextAreaDescription}.growMin = height;" />
</Listeners>
</ext:Resizable>
</Body>
</ext:FormPanel>
</ext:FitLayout>
</Body>
</ext:Panel>
</body>
</html>Leo
