使用 Ext.Net TreePanel,TabPanel控件 布局

<%@ Page Language="C#" %>

<%@ Import Namespace="System.Collections.Generic" %>
<%@ 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 id="Head1" runat="server">
    <title></title>
    <link href="http://www.cnblogs.com/http://www.cnblogs.com/resources/css/examples.css" rel="stylesheet" type="text/css" />
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            SiteMapNode siteNode = SiteMap.RootNode;
            Ext.Net.TreeNode root = this.CreateNode(siteNode);
            TreePanel1.Root.Add(root);
            TreePanel1.ExpandAll();
        }
        
        
        //dynamic node creation
        private TreeNodeBase CreateNodeWithOutChildren(SiteMapNode siteMapNode)
        {
            TreeNodeBase treeNode;

            if (siteMapNode.ChildNodes != null && siteMapNode.ChildNodes.Count>0)
            {
                treeNode = new AsyncTreeNode();
            }
            else
            {
                treeNode = new Ext.Net.TreeNode();
                treeNode.Leaf = true;
            }
            
            if (!string.IsNullOrEmpty(siteMapNode.Url))
            {
                treeNode.Href = this.Page.ResolveUrl(siteMapNode.Url);
            }

            treeNode.NodeID = siteMapNode.Key;
            treeNode.Text = siteMapNode.Title;
            treeNode.Qtip = siteMapNode.Description;

            return treeNode;
        }

        //static node creation with children
        private Ext.Net.TreeNode CreateNode(SiteMapNode siteMapNode)
        {
            Ext.Net.TreeNode treeNode = new Ext.Net.TreeNode();

            if (!string.IsNullOrEmpty(siteMapNode.Url))
            {
                treeNode.Href = this.Page.ResolveUrl(siteMapNode.Url);    
            }
            
            treeNode.NodeID = siteMapNode.Key;
            treeNode.Text = siteMapNode.Title;
            treeNode.Qtip = siteMapNode.Description;

            SiteMapNodeCollection children = siteMapNode.ChildNodes;

            if (children != null && children.Count > 0)
            {
                foreach (SiteMapNode mapNode in siteMapNode.ChildNodes)
                {
                    treeNode.Nodes.Add(this.CreateNode(mapNode));
                }
            }
            
            return treeNode;
        }
    </script>
    
    <script type="text/javascript">
        var loadPage = function (tabPanel, node) {
            var tab = tabPanel.getItem(node.id);

            if (!tab) {
                tab = tabPanel.add({
                    id: node.id,
                    title: node.text,
                    closable: true,
                    autoLoad: {
                        showMask: true,
                        url: node.attributes.href,
                        mode: "iframe",
                        maskMsg: "Loading " + node.attributes.href + "..."
                    },
                    listeners: {
                        update: {
                            fn: function (tab, cfg) {
                                cfg.iframe.setHeight(cfg.iframe.getSize().height);
                            },
                            scope: this,
                            single: true
                        }
                    }
                });
            }

            tabPanel.setActiveTab(tab);
        }
    </script>
</head>
<body>
    <form id="Form1" runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        
        <ext:Viewport ID="Viewport1" runat="server">
            <Items>
                <ext:BorderLayout ID="BorderLayout1" runat="server">
                    <West Collapsible="true" 
                        Split="true" 
                        MinWidth="175" 
                        MaxWidth="400" 
                        MarginsSummary="5 0 5 5" 
                        CMarginsSummary="5 5 5 5">
                        <ext:TreePanel 
                            ID="TreePanel1"
                            runat="server" 
                            Width="300" 
                            Title="" 
                            Icon="ChartOrganisation">            
                            <Listeners>
                                <Click Handler="if (node.attributes.href) { e.stopEvent(); loadPage(#{Pages}, node); }" />
                            </Listeners>
                        </ext:TreePanel>
                    </West>
                    
                    <Center  MarginsSummary="0 0 0 0">
                       <ext:TabPanel ID="Pages" runat="server" EnableTabScroll="true" />
                    </Center>
                    
                </ext:BorderLayout>
            </Items>
        </ext:Viewport>
    </form>
</body>
</html>

Web.sitemap

<?xml version="1.0" encoding="utf-8"?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0">
  <siteMapNode title="一级菜单">
    <siteMapNode title="二级菜单">
      <siteMapNode title="页面" description="页面" url="Default.aspx" />
          </siteMapNode>
  </siteMapNode>
</siteMap>
<Listeners>
    <Click Handler="if (node.attributes.href) { e.stopEvent(); loadPage(#{Pages}, node); }" />
</Listeners>

当点击树的节点时,如果当前节点可以导航, 就添加或激活一个tab页,

两个日期控件范围

View Code
<ext:DateField ID="Start_Date" runat="server" Width="250" FieldLabel="有效期" Format="yyyy-MM-dd"
Vtype
="daterange">
<Listeners>
<Render Handler="this.endDateField ='#{End_Date}'" />
</Listeners>
</ext:DateField>
<ext:DateField ID="End_Date" runat="server" Width="250" FieldLabel="至" Format="yyyy-MM-dd"
Vtype
="daterange">
<Listeners>
<Render Handler="this.endDateField ='#{Start_Date}'" />
</Listeners>
</ext:DateField>

在线Api查询

http://hi.baidu.com/xpj_jy/blog

http://www.cnblogs.com/meiqunfeng/tag/Coolite/

原文地址:https://www.cnblogs.com/geass/p/2048807.html