[CLOSED] Anchor Layout Issue (IE)

**Daniil** · Nov 08, 2011, 5:19 AM

Please use:

Ext.Net.X.IsIE6-9

**nhg_itd** · Nov 08, 2011, 5:55 AM

Originally Posted by Daniil

Please use:

Ext.Net.X.IsIE6-9

is it for javascript or code behind?

seem cant find in code behind property

**Daniil** · Nov 08, 2011, 6:25 AM

It's C#.

These properties has been added to SVN on October'13, revision #3735.

**nhg_itd** · Nov 08, 2011, 7:45 AM

i just re-download again the dll

still cant find

**Daniil** · Nov 08, 2011, 7:53 AM

Re-downloaded 1.2?

But these properties appeared after 1.2 release.

For now it's available only in SVN.

**nhg_itd** · Nov 10, 2011, 6:18 AM

hi daniil,

i've manage to change it to accordion just like in your sample

but it come with problem

situation i've 6 panel but only 3 are collapsable, and 3 panel that non collapsable should be shown because having the top bar

ilustration

Panel 1 contain topbar non collapsable and must show the topbar everytime
panel 2 contain data collapsable
panel 3 contain topbar non collapsable and must show the topbar everytime
panel 4 contain data collapsable
panel 5 contain topbar non collapsable and must show the topbar everytime
panel 6 contain data collapsable

is it possible with accordion layout

you can refer to my screenshot, that's sample with 4 panel only (2 contain topbar and 2 data)

**Daniil** · Nov 10, 2011, 6:29 AM

Please clarify: does these Panels with a TopBar contain only that TopBar and should not be collapsed and expanded at all?

**nhg_itd** · Nov 10, 2011, 6:33 AM

Originally Posted by Daniil

Please clarify: does these Panels with a TopBar contain only that TopBar and should not be collapsed and expanded at all?

confirmed yes.

**Daniil** · Nov 10, 2011, 7:04 AM

I can suggest a bit different solution, it should suite your needs.

Example

<%@ 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>

    <ext:ResourcePlaceHolder runat="server" Mode="ScriptFiles" />

    <script type="text/javascript">
        Ext.layout.AccordionLayout.override({
             setItemSize : function(item, size){
                if(this.fill && item){
                    var hh = 0, i, ct = this.getRenderedItems(this.container), len = ct.length, p;
                    // Add up all the header heights
                    for (i = 0; i < len; i++) {
                        if((p = ct[i]) != item && !p.hidden){
                            hh += p.header.getHeight();

                            //modification
                            if (p.topToolbar) {
                                hh += p.topToolbar.getHeight();
                            }
                            //add modification
                        }
                    };
                    // Subtract the header heights from the container size
                    size.height -= hh;
                    // Call setSize on the container to set the correct height.  For Panels, deferedHeight
                    // will simply store this size for when the expansion is done.
                    item.setSize(size);
                }
            }
        });
    </script>
    
    <style type="text/css">
        .ext-ie6 .x-column {
            padding: 0px !important;
        }
    </style>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:Viewport runat="server" Layout="BorderLayout">
            <Items>
                <ext:Panel
                    runat="server"
                    Height="30"
                    Region="North"
                    Html="North" />
                <ext:Panel
                    runat="server"
                    Region="Center"
                    Layout="AccordionLayout"
                    HideMode="Offsets">
                    <LayoutConfig>
                        <ext:AccordionLayoutConfig OriginalHeader="true" CollapseFirst="true" />
                    </LayoutConfig>
                    <Items>
                        <ext:Panel
                            runat="server"
                            Title="Panel1"
                            Collapsed="false"
                            CollapseEl="body"
                            Layout="ColumnLayout">
                             <TopBar>
                                <ext:Toolbar runat="server">
                                    <Items>
                                        <ext:DisplayField runat="server" Text="Toolbar" />
                                    </Items>
                                </ext:Toolbar>
                            </TopBar>
                            <Items>
                                <ext:Panel runat="server" ColumnWidth="0.40" Html="Column1" />
                                <ext:Panel runat="server" ColumnWidth="0.60" Html="Column2" />
                            </Items>
                            <Listeners>
                                <Collapse Handler="this.ownerCt.layout.setActiveItem(1);" />
                            </Listeners>
                        </ext:Panel>
                       <ext:Panel
                            runat="server"
                            Title="Panel2"
                            Collapsed="false"
                            CollapseEl="body"
                            Layout="ColumnLayout">
                             <TopBar>
                                <ext:Toolbar runat="server">
                                    <Items>
                                        <ext:DisplayField runat="server" Text="Toolbar" />
                                    </Items>
                                </ext:Toolbar>
                            </TopBar>
                            <Items>
                                <ext:Panel runat="server" ColumnWidth="0.40" Html="Column1" />
                                <ext:Panel runat="server" ColumnWidth="0.60" Html="Column2" />
                            </Items>
                            <Listeners>
                                <Collapse Handler="this.ownerCt.layout.setActiveItem(0);" />
                            </Listeners>
                        </ext:Panel>
                    </Items>
                </ext:Panel>
            </Items>
        </ext:Viewport>
    </form>
</body>
</html>

**nhg_itd** · Nov 10, 2011, 7:29 AM

is it possible to remove the title header?

so the collapse/expand will be done with button in the toolbar calling the code behind?

anyway it still not met the requirement actually, since the 2nd topbar are hidden when the 1st panel are shown.

Thread: [CLOSED] Anchor Layout Issue (IE)

Thread Tools

Search Thread

Display

Similar Threads

[CLOSED] layout issue when using RowLayout within column layout

[CLOSED] Layout issue

[CLOSED] Layout Issue

[CLOSED] Column Layout inside Anchor

[CLOSED] Layout issue

Tags for this Thread

Posting Permissions

Sitemap

Downloads

Resources