[CLOSED] Group header align text bottom

Page 1 of 2 12 LastLast
  1. #1

    [CLOSED] Group header align text bottom

    I have some columns grouped, others not in a GridPanel..
    See image.
    How can I get the text in the headers vertical-align bottom for the columns that aren't grouped?

    I achieved this with the unit column, by wrapping a header around that single column, with no text:

    <ext:Column runat="server" Border="false">
                        <Columns>
                            <ext:Column runat="server" DataIndex="UnitOfMeasurement" Header="Unit" ColumnID="UnitOfMeasurement" Width="75" Align="Left" Hideable="false" Border="false">
                                <Editor>
                                    <ext:TextField runat="server" SelectOnFocus="true" />
                                </Editor> 
                            </ext:Column>
                        </Columns>
                    </ext:Column>

    But when I tried that with the Metric column, the Flex wasn't being honored...
            <ext:Column runat="server" Border="false">
                        <Columns>
            <ext:Column runat="server" DataIndex="Title" Header="Metric" ColumnID="Title" Flex="1" Align="Left" Hideable="false" Border="false" StyleSpec="vertical-align:bottom;"  >
                                <Renderer Fn="PerformanceMetrics.fixTitle" />
                                <Editor>
                                    <ext:TextField runat="server" SelectOnFocus="true" />
                                </Editor>
                            </ext:Column> 
        </Columns>
                    </ext:Column>
    Click image for larger version. 

Name:	Capture.PNG 
Views:	15 
Size:	31.6 KB 
ID:	7389
    Last edited by Daniil; Dec 23, 2013 at 4:25 AM. Reason: [CLOSED]
  2. #2
    Hello!

    Try to add the following handler of AfterRender event:

    <ext:Column runat="server" DataIndex="Title" Header="Metric" ColumnID="Title" Flex="1" Align="Left" Hideable="false" Border="false" StyleSpec="vertical-align:bottom;"  >
    	<Renderer Fn="PerformanceMetrics.fixTitle" />
    	<Editor>
    		<ext:TextField runat="server" SelectOnFocus="true" />
    	</Editor>
    	<Listeners>
            <AfterRender Delay="10" Handler="item.titleEl.setStyle('padding', '26px 6px 0px');" />
        </Listeners>
    </ext:Column>
  3. #3
    Quote Originally Posted by Baidaly View Post
    Hello!

    Try to add the following handler of AfterRender event:

    <ext:Column runat="server" DataIndex="Title" Header="Metric" ColumnID="Title" Flex="1" Align="Left" Hideable="false" Border="false" StyleSpec="vertical-align:bottom;"  >
        <Renderer Fn="PerformanceMetrics.fixTitle" />
        <Editor>
            <ext:TextField runat="server" SelectOnFocus="true" />
        </Editor>
        <Listeners>
            <AfterRender Delay="10" Handler="item.titleEl.setStyle('padding', '26px 6px 0px');" />
        </Listeners>
    </ext:Column>
    No love :(..
    I increased the delay and the 26 to 36, still nothing...IE 11 and Chrome
  4. #4
    Can you provide a sample to reproduce?
  5. #5
    Quote Originally Posted by Baidaly View Post
    Can you provide a sample to reproduce?
    <%@ Page Language="C#" %>
     
    <%@ 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">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Ext.NET Example</title>
         
     
          
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server">
                   
            
            </ext:ResourceManager>
             
           <ext:GridPanel runat="server" width="800">
         <ColumnModel>
          <Columns>
           <ext:Column runat="server" DataIndex="TMEEnd" Text="Metric" ColumnID="TMEEnd" Width="75" Align="Right">
            <Listeners>
             <AfterRender Delay="10" Handler="item.titleEl.setStyle('padding', '26px 6px 0px');" />
            </Listeners>
           </ext:Column>
           <ext:Column runat="server" Text="3 Months Ended">
            <Columns>
             <ext:Column runat="server" DataIndex="TMEStart" Text="9/30/2012" ColumnID="TMEStart" Width="75" Align="Right">
            
             </ext:Column>
             <ext:Column runat="server" DataIndex="TMEEnd" Text="9/30/2011" ColumnID="TMEEnd" Width="75" Align="Right">
          
             </ext:Column>
            </Columns>
           </ext:Column>
           <ext:Column runat="server" DataIndex="TMEEnd" Text="Other" ColumnID="TMEEnd" Width="75" Align="Right">
           </ext:Column>
          </Columns>
         </ColumnModel>
           </ext:GridPanel>
    
        </form>
    </body>
    </html>
    Resize the column to simulate Flex...and the title moves back up.
  6. #6
    Try to set Delay to 100. In what browser do you test?
  7. #7
    IE 11 and latest autoupdated chrome. I set delay to 500, still happens.
  8. #8
    Try the following trick:

    <ext:Column ID="Column1" runat="server" DataIndex="TMEEnd" ColumnID="TMEEnd" Width="75" Align="Right">
            <HeaderItems>
                <ext:Label runat="server" Html="Metric" />
            </HeaderItems>
            <Listeners>
            </Listeners>
        </ext:Column>
  9. #9
    Quote Originally Posted by Baidaly View Post
    Try the following trick:

    <ext:Column ID="Column1" runat="server" DataIndex="TMEEnd" ColumnID="TMEEnd" Width="75" Align="Right">
            <HeaderItems>
                <ext:Label runat="server" Html="Metric" />
            </HeaderItems>
            <Listeners>
            </Listeners>
        </ext:Column>
    That worked, but how to I center just the header, not the column? Code below did not work...

    <HeaderItems>
    								<ext:Label runat="server" Html="Metric" StyleSpec="text-align:center;" />
    							</HeaderItems>
  10. #10
    Try to set Column's Align to Center:

    <ext:Column ID="Column1" runat="server" DataIndex="TMEEnd" ColumnID="TMEEnd" Width="75" Align="Center">
        <HeaderItems>
            <ext:Label runat="server" Html="Metric" />
        </HeaderItems>
        <Listeners>
        </Listeners>
    </ext:Column>
Page 1 of 2 12 LastLast

Similar Threads

  1. [CLOSED] GridPanel header group text oddity
    By rthiney in forum 2.x Legacy Premium Help
    Replies: 4
    Last Post: Dec 13, 2013, 6:22 PM
  2. [CLOSED] Custom Grid Group Header Text
    By bayoglu in forum 2.x Legacy Premium Help
    Replies: 4
    Last Post: May 17, 2013, 3:38 PM
  3. [CLOSED] Change text in header group column.
    By pdcase in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Mar 09, 2011, 3:44 PM
  4. [CLOSED] CompositeField align bottom
    By SouthDeveloper in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Feb 25, 2011, 1:53 AM
  5. group header text multiline problem
    By wp_joju in forum 1.x Help
    Replies: 0
    Last Post: Dec 21, 2010, 10:54 AM

Posting Permissions