asp.net 第三方UI控件 Telerik KendoUI 之 TreeVIew 的用法记录

2021-05-16 22:30

阅读：590

标签：sele textfield asc fun parent inline tle convert UI

一、前台显示

　　备注：一次性取出所有节点

function loadTreeData() {
        $.ajax({
            type: ‘POST‘,
            url: ‘@(Html.UrlHref("ScriptSite", "/FilesManager/MyFiles/GetFolderTree"))‘,
            data: {},
            success: function (result) {
                if (result) {
                        inlineDefault = new kendo.data.HierarchicalDataSource({
                            data: eval(result),
                            schema: {
                                model: {
                                    children: "Items"
                                }
                            }
                        });
                        $("#treeviewFolder").kendoTreeView({
                            dataSource: inlineDefault,
                            change: onTreeViewChange,
                            dataTextField: ["Text"]
                        });
                }
                else {

                }
            },
            error: function (err) {
                window.alert(err);
            }
        });
}

二、后台实现

1、获取树的主方法

        public string GetFolderTree()
        {
            List lstNodes = new FileManageLogic().GetMyFolderTree(CurrentUser.Id);
            string strResult = Newtonsoft.Json.JsonConvert.SerializeObject(lstNodes);
            return strResult;
        }

根据条件获得树型控件里的所有需要的数据

        public List GetMyFolderTree(Guid userId)
        {
            List lstResult = new List();
            dvaContext context = new dvaContext();
            List lstPaths = context.Database.SqlQuery("select ID,PID,SEQ,D_PATH from es_data_path where createuserid=‘" + userId.ToString() + "‘").ToList();
            GetKendoTree(lstPaths, lstResult, context, userId);
            return lstResult;
        }

递归实现父子级绑定的关系

private void AddChildKendoTree(List lstTree, es_data_path_mini currentPath, List lstPaths, bool isFirstLevel)
        {
            Cust_TreeViewItemModel currentTreeNode = new Cust_TreeViewItemModel();
            currentTreeNode.Text = currentPath.D_PATH;
            currentTreeNode.Id = currentPath.ID.ToString();
            currentTreeNode.Items = null;
            currentTreeNode.ParentId = currentPath.PID.ToString();
            if (isFirstLevel)
            {
                currentTreeNode.Expanded = true;
            }
            else
            {
                currentTreeNode.Expanded = false;
            }
            currentTreeNode.Remarks = "";
            currentTreeNode.spriteCssClass = "folder";
            if (currentTreeNode.Items == null)
            {
                currentTreeNode.Items = new List();
            }
            List lstChildPath = lstPaths.Where(c => c.PID == currentPath.ID).ToList();
            if (lstChildPath != null && lstChildPath.Any())
            {
                currentTreeNode.HasChildren = true;
                foreach (var path in lstChildPath)
                {
                    AddChildKendoTree(currentTreeNode.Items, path, lstPaths, false);
                }
            }
            else
            {
                currentTreeNode.HasChildren = false;
            }
            if (currentTreeNode.Items.Count == 0)
            {
                currentTreeNode.Items = null;
            }
            lstTree.Add(currentTreeNode);
        }

三、技巧

1、根据数据里的id获得当前记录（主键一定要用全小写的id，全部小写，我为什么这么强调？！因为我在这个问题上怀疑人生了一个多小时）

var barDataItem = treeview.dataSource.get(currentSelectedId);

2、根据当前记录的uid获得当前记录的node，下面的barElement 已经是一个node类型的值。

var barElement = treeview.findByUid(barDataItem.uid);

3、根据一个node获得它绑定的数据的id值：

(‘#treeviewFolder‘).data(‘kendoTreeView‘).dataItem(node).id

4、根据一个node获取它绑定的数据的Text值：

$(‘#treeviewFolder‘).data(‘kendoTreeView‘).dataItem(node).Text

5、根据一个node获取它的父级node

treeview, treeview.parent(node)

6、自动选中treeView上的某一个节点

var treeView = $(‘#treeviewFolder‘).data(‘kendoTreeView‘);
var data = treeView.dataSource.get(id);
var selectitem = treeView.findByUid(data.uid);
treeView.select(selectitem);

asp.net 第三方UI控件 Telerik KendoUI 之 TreeVIew 的用法记录

标签：sele textfield asc fun parent inline tle convert UI

原文地址：http://www.cnblogs.com/wjx-blog/p/7746508.html

上一篇：读取url后参数方法

下一篇：php 面向对象三大特点：封装、继承、多态

文章来自：搜素材网的编程语言模块，转载请注明文章出处。
文章标题：asp.net 第三方UI控件 Telerik KendoUI 之 TreeVIew 的用法记录
文章链接：http://soscw.com/index.php/essay/86442.html

亲，登录后才可以留言！

asp.net 第三方UI控件 Telerik KendoUI 之 TreeVIew 的用法记录

评论

热门文章

推荐文章

最新文章

置顶文章