[CLOSED] ColumnLayout - not setting width before content

Page 2 of 6 FirstFirst 1234 ... LastLast
  1. #11
    Quote Originally Posted by craig2005 View Post
    The other two aren't relevant. They are just calls to other files. Why do they matter?
    If you are including code in your samples that are not relevant, then the best thing to do is to remove that code from your sample.

    If your code sample includes another file, then it is relevant.
    Geoffrey McGill
    Founder
  2. #12
    The HBoxLayout may be an option as well, although both HBoxLayout and ColumnLayout are proportional width layouts. They do not support fixed widths.
    Geoffrey McGill
    Founder
  3. #13
    Another pro-tip here, in future threads, you might want to split things up into separate questions. You're asking a lot of questions in one thread, which makes things challenging to keep straight, follow and respond too.

    Asking lots of questions is obviously fine (encouraged), but doing so in a manner which helps keep things organised and clear will benefit everyone.
    Geoffrey McGill
    Founder
  4. #14
    sorry, i thought both were relevant since they are height and width issues.

    Were you able to get the sample working without specifying a set height?
  5. #15
    Quote Originally Posted by geoffrey.mcgill View Post
    The HBoxLayout may be an option as well, although both HBoxLayout and ColumnLayout are proportional width layouts. They do not support fixed widths.
    oh, i see... so the width is based on the content inside and not the parent?

    If the parent has a width of 500, would the ColumnLayout automatically scale to the parent at by 500? Or would it only scale to what is being rendered inside it?
  6. #16
    Quote Originally Posted by geoffrey.mcgill View Post
    If you are including code in your samples that are not relevant, then the best thing to do is to remove that code from your sample.

    If your code sample includes another file, then it is relevant.
    Ok, i was referring to the autoheight. I thought it was important to show that i am using autoload for a panel. I thought it didn't really matter what i was loading because it is easily reproducible by loading any ascx file in that panel.
  7. #17
    Quote Originally Posted by geoffrey.mcgill View Post
    The HBoxLayout may be an option as well, although both HBoxLayout and ColumnLayout are proportional width layouts. They do not support fixed widths.
    Actually, this is not entirely accurate.

    The HBoxLayout does support fixed widths for child BoxComponents. You can set a fixed Width on any Panel and that fixed width will be observed correctly.

    If you have multiple fixed width Panels inside an HBoxLayout, one of the Panels could also be configured to use the remainder of the space available, by setting .Flex="1" on that Panel.

    Hope this helps.
    Geoffrey McGill
    Founder
  8. #18
    well that seemed to work, but now i get a height issue with the HBoxLayout :-)
  9. #19
    Hi,

    What height issue do you have? Try to add the following config to the container
    <LayoutConfig>
                        <ext:HBoxLayoutConfig Align="Stretch" />
                     </LayoutConfig>
  10. #20
    Hi,

    I prepared for you an example with some tricks - please investigate the code and ask questions if you will have any.

    This example also demonstrate how readable and clear can look the code:)

    Index.aspx
    <%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <asp:Content ContentPlaceHolderID="MainContent" runat="server">
        <ext:ResourceManager runat="server" />
        <ext:Panel runat="server">
            <Items>
                <ext:TabPanel runat="server" Height="500">
                    <Items>
                        <ext:Panel 
                            ID="homeTab" 
                            runat="server" 
                            Title="Home" 
                            Layout="fit">
                            <AutoLoad Url="/Home/HomeTab" NoCache="true" ShowMask="true">
                                <Params>
                                    <ext:Parameter 
                                        Name="containerId" 
                                        Value="function () { 
                                            return #{homeTab}.id; 
                                        }"
                                        Mode="Raw" />
                                </Params>
                            </AutoLoad>
                        </ext:Panel>
                        <ext:Panel runat="server" Title="Another tab" />
                    </Items>
                </ext:TabPanel>
            </Items>
        </ext:Panel>
    </asp:Content>
    HomeTab.ascx
    <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <ext:Panel ID="homeTabLayoutWrapper" runat="server" Layout="hbox">
        <LayoutConfig>
            <ext:HBoxLayoutConfig Align="Stretch" />
        </LayoutConfig>
        <Items>
            <ext:Panel 
                ID="homeGrid" 
                runat="server"
                Flex="1" 
                Layout="fit">
                <AutoLoad Url="/Home/HomeGrid" ShowMask="true">
                    <Params>
                        <ext:Parameter 
                            Name="containerId" 
                            Value="function () { 
                                return #{homeGrid}.id; 
                            }" Mode="Raw" />
                    </Params>
                </AutoLoad>
            </ext:Panel>
            <ext:Panel runat="server" Width="200" Layout="accordion">
                <Items>
                    <ext:Panel runat="server" Title="Events" Html="Events" />
                    <ext:Panel runat="server" Title="Photos" Html="Photos" />
                </Items>
            </ext:Panel>
        </Items>
    </ext:Panel>
    HomeGrid.ascx
    <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                Store store = this.GridPanel1.GetStore();
                store.DataSource = new object[] 
                { 
                    new object[] {"test1"},
                    new object[] {"test2"},
                    new object[] {"test3"},
                    new object[] {"test4"},
                    new object[] {"test5"},
                    new object[] {"test6"},
                    new object[] {"test7"},
                    new object[] {"test8"},
                    new object[] {"test9"}
                };
                store.DataBind();
            }
        }
    </script>
    
    <ext:GridPanel ID="GridPanel1" runat="server">
        <Store>
            <ext:Store runat="server">
                <Reader>
                    <ext:ArrayReader>
                        <Fields>
                            <ext:RecordField Name="test" />
                        </Fields>
                    </ext:ArrayReader>
                </Reader>
            </ext:Store>
        </Store>
        <ColumnModel runat="server">
            <Columns>
                <ext:Column Header="Test" DataIndex="test" />
            </Columns>
        </ColumnModel>
        <BottomBar>
            <ext:PagingToolbar runat="server" PageSize="3" />
        </BottomBar>
    </ext:GridPanel>
    HomeController.cs part
    public ActionResult HomeTab(string containerId)
    {
        Ext.Net.MVC.PartialViewResult pr = new Ext.Net.MVC.PartialViewResult(containerId, RenderMode.AddTo);
        pr.ControlToRender = "homeTabLayoutWrapper";
        return pr;
    }
    
    public ActionResult HomeGrid(string containerId)
    {
        Ext.Net.MVC.PartialViewResult pr = new Ext.Net.MVC.PartialViewResult(containerId, RenderMode.AddTo);
        pr.SingleControl = true; //alternative of .ControlToRender if there is only one top control.
        return pr;
    }
    Last edited by Daniil; Feb 07, 2011 at 8:38 AM.
Page 2 of 6 FirstFirst 1234 ... LastLast

Similar Threads

  1. [CLOSED] setting column width in javascript has no effect
    By GLD in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: May 23, 2012, 1:48 PM
  2. Replies: 1
    Last Post: Nov 04, 2011, 8:51 AM
  3. [CLOSED] Content Gridpanel does not resize back to a full width
    By deejayns in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Apr 28, 2011, 12:32 PM
  4. Replies: 0
    Last Post: May 14, 2009, 10:11 PM
  5. [CLOSED] User Control width within ColumnLayout
    By Steve in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: May 13, 2009, 5:08 AM

Tags for this Thread

Posting Permissions