Ext.net中,TabPanel添加页面

Ext.net中点击左边的节点,右边tab添加页面
效果图如下:
代码如下:
JS
    <script type="text/javascript">
        var addTab = function (tabPanel, id, title, url) {
            var tab = tabPanel.add({
                id: id,
                title: title,
                closable: true,
                closeAction: "hide",
                autoLoad: {
                    showMask: true,
                    url: url,
                    //                     url: "http://www.baidu.com",
                    mode: "iframe",
                    maskMsg: "加载中..."
                },
                listeners: {
                    update: {
                        fn: function (cfg) {
                            cfg.iframe.setHeight(cfg.iframe.getSize().height - 10);
                        },
                        scope: this,
                        single: true
                    }
                }
            });
            //            }

            tabPanel.setActiveTab(tab);
        }

    </script>

aspx前台基本代码:

<ext:TreeNode NodeID="MenuItem1" Text="收文登记" Expandable="False" Leaf="true">
      <Listeners>
          <Click Handler="e.stopEvent(); addTab(#{ShowPage},'MenuItem1','收文登记','LR_CollectRegistration.aspx'); " />
      </Listeners>
</ext:TreeNode>

 其中,ShowPage是TabPanel的id

<ext:TabPanel ID="ShowPage" runat="server" Region="Center" ActiveTabIndex="0" Border="false" Title="Center" AutoScroll="True">
            <Items>
                <ext:Panel ID="test1" runat="server" Closable="false" Title="首页">
                    <Items>
                    </Items>
                </ext:Panel>
            </Items>
    </ext:TabPanel>

挺实用的方法,有更好的方法欢迎大家一起来交流学习。

posted @ 2012-02-22 18:02  然嗄  阅读(2192)  评论(1编辑  收藏  举报