TreeGrid 两种不同绑定

TreeGrid 在ext.net中功能确实很强大的，其中一个就可以异步的加载数据，就是首先加载出根节点然后再加载出子节点，我在项目中使用了两种显示数据的方式，一种是直接展示所有节点，一种便是异步的加载。
1.加载所有节点数据，后台肯定要获取对应的数据源信息，绑定代码如下：

View Code

private void BindData()
        {
            tgProductTreeInfo.Root.Clear();
            tgProductTreeInfo.AutoDataBind = true;
            tgProductTreeInfo.RootVisible = false;
            CreateNode(tgProductTreeInfo.Root);
            tgProductTreeInfo.DataBind();
        }
        public Ext.Net.TreeNodeCollection CreateNode(Ext.Net.TreeNodeCollection roots)
        {
            return CreateNode(roots, GetSortDetailedData(this.SortID));
        }
        public Ext.Net.TreeNodeCollection CreateNode(Ext.Net.TreeNodeCollection roots, List<SortDetailedEntity> rows)
        {
            //伪Root节点（不显示）
            Ext.Net.TreeNode tempRoot = new Ext.Net.TreeNode() { Text = "TempRoot" };
            roots.Add(tempRoot);

            if (rows == null || rows.Count < 1)
            {
                return roots;
            }

            //查找根节点
            SortDetailedEntity rootEntity;
            //if (string.IsNullOrEmpty(SortDetailed))
            //{
            rootEntity = rows.Where(n => n.FatherSortDetailedID.Equals(Guid.Empty.ToString())).FirstOrDefault();
            //}
            //else
            //{
            //    rootEntity = rows.Where(n => n.SortDetailedID == SortDetailed).FirstOrDefault();
            //}

            Ext.Net.TreeNode root = new Ext.Net.TreeNode();
            tempRoot.Nodes.Add(root);
            if (rootEntity != null)
            {
                //给节点属性赋值
                root.Expanded = true;
                root.NodeID = Convert.ToString(rootEntity.SortDetailedID);
                root.CustomAttributes.Add(new ConfigItem() { Name = "SortDetailedID", Value = Convert.ToString(rootEntity.SortDetailedID), Mode = ParameterMode.Value });
                root.CustomAttributes.Add(new ConfigItem() { Name = "FatherSortDetailedID", Value = Convert.ToString(rootEntity.FatherSortDetailedID), Mode = ParameterMode.Value });
                root.CustomAttributes.Add(new ConfigItem() { Name = "SortID", Value = Convert.ToString(rootEntity.SortID), Mode = ParameterMode.Value });
                root.CustomAttributes.Add(new ConfigItem() { Name = "Code", Value = rootEntity.Code, Mode = ParameterMode.Value });
                root.CustomAttributes.Add(new ConfigItem() { Name = "SortDetailedName", Value = rootEntity.SortDetailedName, Mode = ParameterMode.Value });
                root.CustomAttributes.Add(new ConfigItem() { Name = "State", Value = Convert.ToString(rootEntity.State), Mode = ParameterMode.Value });
                root.CustomAttributes.Add(new ConfigItem() { Name = "Note", Value = Convert.ToString(rootEntity.Note), Mode = ParameterMode.Value });
                CreateTreeNode(root, rows);
            }
            return roots;
        }
        private void CreateTreeNode(Ext.Net.TreeNode _Node, List<SortDetailedEntity> _Rows)
        {
            //查找当前节点的孩子节点
            IEnumerable<SortDetailedEntity> _Children = _Rows.Where(n => _Node.NodeID.Equals(n.FatherSortDetailedID));
            if (_Children.Count() < 1) return;

            foreach (SortDetailedEntity rootEntity in _Children)
            {
                Ext.Net.TreeNode _Child = new Ext.Net.TreeNode();
                //给节点属性赋值
                _Child.NodeID = Convert.ToString(rootEntity.SortDetailedID);
                _Child.CustomAttributes.Add(new ConfigItem() { Name = "SortDetailedID", Value = Convert.ToString(rootEntity.SortDetailedID), Mode = ParameterMode.Value });
                _Child.CustomAttributes.Add(new ConfigItem() { Name = "FatherSortDetailedID", Value = Convert.ToString(rootEntity.FatherSortDetailedID), Mode = ParameterMode.Value });
                _Child.CustomAttributes.Add(new ConfigItem() { Name = "SortID", Value = Convert.ToString(rootEntity.SortID), Mode = ParameterMode.Value });
                _Child.CustomAttributes.Add(new ConfigItem() { Name = "Code", Value = rootEntity.Code, Mode = ParameterMode.Value });
                _Child.CustomAttributes.Add(new ConfigItem() { Name = "SortDetailedName", Value = rootEntity.SortDetailedName, Mode = ParameterMode.Value });
                _Child.CustomAttributes.Add(new ConfigItem() { Name = "State", Value = Convert.ToString(rootEntity.State), Mode = ParameterMode.Value });
                _Child.CustomAttributes.Add(new ConfigItem() { Name = "Note", Value = Convert.ToString(rootEntity.Note), Mode = ParameterMode.Value });

                _Node.Nodes.Add(_Child);
                CreateTreeNode(_Child, _Rows);
            }
        }

前端代码：

View Code

<ext:TreeGrid ID="tgProductTreeInfo" runat="server" AutoWidth="true" StripeRows="true"
                        EnableDD="false" AllowLeafDrop="false" EnableSort="false" EnableDrag="false"
                        EnableDrop="false" UseArrows="true">
                        <Columns>                            
                            <ext:TreeGridColumn Header="分类名称" Width="300" DataIndex="SortDetailedName" />
                            <ext:TreeGridColumn Header="代号" Width="200" DataIndex="Code" />
                            <ext:TreeGridColumn Header="状态" Width="100" DataIndex="State">
                                <XTemplate runat="server">
                                    <Html>
                                        {State:this.fnState}
                                    </Html>
                                    <Functions>
                                        <ext:JFunction Name="fnState" Fn="fnState" />
                                    </Functions>
                                </XTemplate>
                            </ext:TreeGridColumn>
                            <ext:TreeGridColumn Header="备注" Width="200" DataIndex="Note" />
                            <ext:TreeGridColumn Header="操作" Width="100">
                                <XTemplate ID="XTemplate8" runat="server">
                                    <Html>
                                        <a id="hlEdit" onclick="edit('{SortDetailedID}','{FatherSortDetailedID}','{Code}')"
                                            class="AShow" ext:qtip="编 辑">
                                            <img alt="编辑" src="http://www.cnblogs.com/Resources/Images/application_edit.png" />编辑
                                        </a>
                                        <a id="hlDelete" onclick="dele('{SortDetailedID}','{SortDetailedName}','{FatherSortDetailedID}')"
                                            class="AShow" ext:qtip="删 除">
                                            <img alt="删除" src="http://www.cnblogs.com/Resources/Images/delete.png" />删除
                                        </a>                                        
                                    </Html>
                                </XTemplate>
                            </ext:TreeGridColumn>
                        </Columns>
                        <SelectionModel>
                            <ext:DefaultSelectionModel>
                                <Listeners>
                    <!--选择节点，获取相应的数据信息-->
                                    <SelectionChange Handler="onRowChanaged(#{tgProductTreeInfo},node)" runat="server"
                                        AutoPostBack="false" />
                                </Listeners>
                            </ext:DefaultSelectionModel>
                        </SelectionModel>                        
                    </ext:TreeGrid>

这便是同时加载所有节点的树信息，下面看看异步加载数据，关键在前端代码上：
首先在前端加入一下javascript代码：

//分层加载产品节点
        function nodeLoad(node) {
            BasicLib.NodeLoad(node.id, {
                success: function (result) {
                    var data = eval("(" + result + ")");
                    node.loadNodes(data);
                },

                failure: function (errorMsg) {
                    Ext.Msg.alert('Failure', errorMsg);
                }
            });

        }

前端页面：

View Code

<ext:ResourceManager ID="ResourceManager1" runat="server" DirectMethodNamespace="BasicLib" />
<ext:TreeGrid ID="tgData" runat="server" AutoWidth="true" StripeRows="true" EnableDD="false" AllowLeafDrop="false"
                        EnableSort="false" EnableDrag="false" EnableDrop="false" UseArrows="true" AutoExpandColumn="0" AutoHeight="true">
                        <Columns>                            
                            <ext:TreeGridColumn Header="故障模式类型" Width="100" DataIndex="FaultModeType"  />
                            <ext:TreeGridColumn Header="故障模式频率" Width="100" DataIndex="FaultModeRatio" />
                            <ext:TreeGridColumn Header="故障模式内容" DataIndex="Content" />
                        </Columns>
                        <Root>
                             <ext:AsyncTreeNode NodeID="0"/><!--关键点-->
                        </Root>
                        <SelectionModel>
                            <ext:DefaultSelectionModel>
                                <Listeners>
                                    <SelectionChange Handler="onRowChanaged(#{tgData},node)" runat="server" AutoPostBack="false" />
                                </Listeners>
                            </ext:DefaultSelectionModel>
                        </SelectionModel>
                        <Listeners>                            
                            <BeforeLoad Fn="nodeLoad" />
                        </Listeners>
                    </ext:TreeGrid>

后台代码：

/方式二：分层加载产品树节点
        [DirectMethod]
        public string NodeLoad(string strNodeId)
        {
            if (strNodeId == "0")
            {
                return CreateRootNode();

            }
            else
            {
                return CreateChildNode(strNodeId);
            }
            
        }
        public string CreateRootNode()
        {
            return GetRootNode(GetData(), string.Empty);
        }
        public string CreateChildNode(string strNodeId)
        {
            return GetChildNode(GetData(), strNodeId);
        }
        private string GetRootNode(List<CommonFaultModeEntity> rows, string strID)
        {
            //伪根节点
            Ext.Net.TreeNodeCollection root = new Ext.Net.TreeNodeCollection();

            //查找根节点的数据
            if (rows != null && rows.Count > 0)
            {
                CommonFaultModeEntity rootEntity;
                if (string.IsNullOrEmpty(strID))
                {
                    //如果没有指定要显示的节点子树，则显示完整的树
                    rootEntity = rows.Where(n => Convert.ToString(n.FatherCommonFaultModeID) == "0").FirstOrDefault();
                    RootProductID = rootEntity.CommonFaultModeID;
                }
                else
                {
                    //显示指定节点的树
                    rootEntity = rows.Where(n => n.CommonFaultModeID == strID).FirstOrDefault();
                    RootProductID = rootEntity.CommonFaultModeID.ToString();
                }
                if (rootEntity != null)
                {
                    //根节点
                    AsyncTreeNode asyncNode = new AsyncTreeNode();
                    root.Add(asyncNode);

                    //给节点属性赋值
                    asyncNode.NodeID = Convert.ToString(rootEntity.CommonFaultModeID);
                    asyncNode.Expanded = false;
                    asyncNode.Leaf = rows.Where(n => Convert.ToString(n.FatherCommonFaultModeID) == Convert.ToString(rootEntity.CommonFaultModeID)).Count() > 0 ? false : true;
                    

                    
                    asyncNode.CustomAttributes.Add(new ConfigItem() { Name = "CommonFaultModeID", Value = Convert.ToString(rootEntity.CommonFaultModeID), Mode = ParameterMode.Value });
                    asyncNode.CustomAttributes.Add(new ConfigItem() { Name = "FatherCommonFaultModeID", Value = Convert.ToString(rootEntity.FatherCommonFaultModeID), Mode = ParameterMode.Value });
                    asyncNode.CustomAttributes.Add(new ConfigItem() { Name = "CommonFaultModeTypeID", Value = Convert.ToString(rootEntity.CommonFaultModeTypeID), Mode = ParameterMode.Value });
                    asyncNode.CustomAttributes.Add(new ConfigItem() { Name = "FaultModeType", Value = Convert.ToString(rootEntity.FaultModeType), Mode = ParameterMode.Value });
                    asyncNode.CustomAttributes.Add(new ConfigItem() { Name = "FaultModeRatio", Value = Convert.ToString(rootEntity.FaultModeRatio), Mode = ParameterMode.Value });
                    asyncNode.CustomAttributes.Add(new ConfigItem() { Name = "Content", Value = Convert.ToString(rootEntity.Content), Mode = ParameterMode.Value });

                }
            }

            return root.ToJson();
        }
        private string GetChildNode(List<CommonFaultModeEntity> rows, string strID)
        {
            //伪根节点
            Ext.Net.TreeNodeCollection root = new Ext.Net.TreeNodeCollection();

            //查找指定节点的数据
            if (rows != null && rows.Count > 0)
            {
                List<CommonFaultModeEntity> childEntity = rows.Where(n => Convert.ToString(n.FatherCommonFaultModeID) == strID).ToList();
                foreach (CommonFaultModeEntity item in childEntity)
                {
                    //根节点
                    AsyncTreeNode asyncNode = new AsyncTreeNode();
                    root.Add(asyncNode);

                    //给节点属性赋值
                    asyncNode.NodeID = Convert.ToString(item.CommonFaultModeID);
                    asyncNode.Expanded = false;
                    asyncNode.Leaf = rows.Where(n => n.FatherCommonFaultModeID == item.CommonFaultModeID).Count() > 0 ? false : true;


                    asyncNode.CustomAttributes.Add(new ConfigItem() { Name = "CommonFaultModeID", Value = Convert.ToString(item.CommonFaultModeID), Mode = ParameterMode.Value });
                    asyncNode.CustomAttributes.Add(new ConfigItem() { Name = "FatherCommonFaultModeID", Value = Convert.ToString(item.FatherCommonFaultModeID), Mode = ParameterMode.Value });
                    asyncNode.CustomAttributes.Add(new ConfigItem() { Name = "CommonFaultModeTypeID", Value = Convert.ToString(item.CommonFaultModeTypeID), Mode = ParameterMode.Value });
                    asyncNode.CustomAttributes.Add(new ConfigItem() { Name = "FaultModeType", Value = Convert.ToString(item.FaultModeType), Mode = ParameterMode.Value });
                    asyncNode.CustomAttributes.Add(new ConfigItem() { Name = "FaultModeRatio", Value = Convert.ToString(item.FaultModeRatio), Mode = ParameterMode.Value });
                    asyncNode.CustomAttributes.Add(new ConfigItem() { Name = "Content", Value = Convert.ToString(item.Content), Mode = ParameterMode.Value });
                }
            }

            return root.ToJson();
        }

posted @ 2012-06-28 10:14 独孤雄阅读(502) 评论(0) 收藏举报

刷新页面返回顶部

TreeGrid 两种不同绑定

公告