May 24, 2013, 4:31 PM
[CLOSED] Textarea with note height is incorrect inside tab panel with deferred render false and not first tab
Hi,
I have some complex forms that include tab panels. I use deferred render = false (to prevent other issues). But when I do so, if I have a textarea with a note, the rendering seems to calculate the height without taking the note into account. So if the note is aligned at the bottom it is cut off, and if it aligned at the top, the textarea gets cut off.
If the same textarea is on the first tab (which probably doesn't need the deferred render handling) then it is okay.
Here is an example:
Looking in the DOM (Firebug/Chrome or IE10 dev tools) I can see the height for the textarea wrapper is set to cover the height of the textarea; the space taken up by the note is not considered).
(In more complex scenarios this can cause other issues, e.g. if you have fieldsets in the second or later tabs which contain the textareas, then they might get scrollbars just to show the notes, etc etc - depending on various other settings of course.)
Any suggestions? In my case I'd prefer not to take off DeferredRender as the solution, as I then have other issues (e.g. form.getValues() of course, but also seems like some nested TabPanels don't always render correctly - though I need to investigate that further, etc.).
I have some complex forms that include tab panels. I use deferred render = false (to prevent other issues). But when I do so, if I have a textarea with a note, the rendering seems to calculate the height without taking the note into account. So if the note is aligned at the bottom it is cut off, and if it aligned at the top, the textarea gets cut off.
If the same textarea is on the first tab (which probably doesn't need the deferred render handling) then it is okay.
Here is an example:
<%@ Page Language="C#" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Textarea tests</title>
</head>
<body>
<ext:ResourceManager runat="server" />
<ext:TabPanel runat="server" DeferredRender="false">
<Items>
<ext:Panel runat="server" Title="Tab" />
<ext:Panel runat="server" Layout="FormLayout" Title="Tab">
<Items>
<ext:TextArea runat="server" FieldLabel="blah" Height="100" Note="Blah blah" NoteAlign="Down" />
<ext:TextField runat="server" FieldLabel="Text" Note="blah2" />
</Items>
</ext:Panel>
</Items>
</ext:TabPanel>
</body>
</html>
When I take DeferredRender="false" off (or set to true) then it is okay.Looking in the DOM (Firebug/Chrome or IE10 dev tools) I can see the height for the textarea wrapper is set to cover the height of the textarea; the space taken up by the note is not considered).
(In more complex scenarios this can cause other issues, e.g. if you have fieldsets in the second or later tabs which contain the textareas, then they might get scrollbars just to show the notes, etc etc - depending on various other settings of course.)
Any suggestions? In my case I'd prefer not to take off DeferredRender as the solution, as I then have other issues (e.g. form.getValues() of course, but also seems like some nested TabPanels don't always render correctly - though I need to investigate that further, etc.).
Last edited by Baidaly; May 29, 2013 at 3:25 AM.
Reason: [CLOSED]