首页
学习
活动
专区
圈层
工具
发布

使用jstree创建无限分级的树(ajax动态创建子节点)

首先来看一下效果 页面加载之初 节点全部展开后 首先数据库的表结构如下 其中Id为主键,PId为关联到自身的外键 两个字段均为GUID形式 层级关系主要靠这两个字段维护 其次需要有一个类型...OrderNum { get; set; } public int SonCount { get; set; } } 此类型比数据库表增加了一个属性 SonCount 这个属性用来记录当前节点的子节点的个数...其中请求参数pid为客户端需要获取的节点ID 如果请求顶级节点,则此参数的值为00000000-0000-0000-0000-000000000000 GetMenu函数获取需要请求的节点数据...如果顶级节点的SonCount属性大于0 则使节点为闭合状态(样式为jstree-closed) 如果节点无子节点 则该节点的样式为jstree-leaf 当用户点击闭合状态的节点时,客户端发起请求...并把点击节点的ID传给后端,后端获取到点击节点的子节点后 通过append添加到点击节点下 至此,无限分级的树创建完成 其中不包含数据库

2.7K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    快速获取子图根节点的属性

    @TOC[1] Here's the table of contents: •一、问题背景•二、构建样例多子图数据•三、实现根节点的属性查找•四、将子图查找的GQL封装为一个函数•五、总结 快速获取子图根节点的属性...本文主要讲述一个确定模式的子图查询方式,对于存在很多子图的数据模型也可以使用本文截图中社区成员提问的方式去建模数据可以达到节省资源空间的目的;不过具体建模场景需要结合业务场景才可行。...已知子图查找问题可以使用APOC中的过程来实现,apoc.path相关输入输出查询[2];指定节点之后获取节点所属的子图,然后从子图中提取出ROOT节点的属性。...四、将子图查找的GQL封装为一个函数 对于一个复杂的查询,通常需要隐藏其实现细节方便业务调用。...下面通过apoc.custom.asFunction这个过程,实现了将三中的复杂查询进一步封装的目的。调用时只需要使用custom.subGraphRootName($para)这个函数即可。

    3.4K10

    使用jsTree树形控件【4】

    标准JSON格式 使用JSON渲染jsTree的话,需要指定JSON的格式,jsTree可以使用两种JSON格式,在标准JSON格式中,没有必需的属性,而且还可以添加自定义的属性。...generated LI node a_attr : {} // attributes for the generated A node } 另外一种JSON格式 上面的标准格式中,子节点是嵌套在父节点中的...jsTree会自动创建相应的树形结构,通过设置parent = "#"来设置节点为父节点。 这种结构适合于需要一次性渲染树形结构或者数据保存在数据库的情况。...AJAX异步加载 还可以使用AJAX异步加载从服务器端获取JSON数据,然后进行渲染,一样的使用$.jstree.defaults.core.data进行配置,如果不能从服务器端获取正确的JSOn内容,...使用函数 还可以给data属性赋值为一个函数,这个函数接收两个参数,一个是正在加载的节点对象,一个是回调函数,回调函数返回子节点信息。

    2.6K10

    JS获取节点的兄弟,父级,子级元素的方法

    2015-08-18 03:48:27 下面介绍JQUERY的父,子,兄弟节点查找方法 jQuery.parent(expr)  找父亲节点,可以传入expr进行过滤,比如$("span").parent...".class") jQuery.parents(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素,不限于父元素 jQuery.children(expr).返回所有子节点...,这个方法只会返回直接的孩子节点,不会返回所有的子孙节点 jQuery.contents(),返回下面的所有内容,包括节点和文本。...这个方法和children()的区别就在于,包括空白文本,也会被作为一个 jQuery对象返回,children()则只会返回节点 jQuery.prev(),返回上一个兄弟节点,不是所有的兄弟节点 jQuery.prevAll...(),返回所有之前的兄弟节点 jQuery.next(),返回下一个兄弟节点,不是所有的兄弟节点 jQuery.nextAll(),返回所有之后的兄弟节点 jQuery.siblings(),返回兄弟姐妹节点

    12K10

    使用Unity获取所有子对象及拓展方法的使用

    一、前言 这个问题还是比较简单的,无非就是一个for循环就可以全部获取到了,但是我喜欢简单直达,有没有直接就能获取到所有的子对象函数呢,搜了好久都没有,所以我准备写一个扩展函数,来自己补充这个函数,一起来看一下吧...二、如何获取所有子对象 第一种方法: 使用foreach循环,找到transform下所有的子物体 foreach(Transform child in transform) { Debug.Log...三、使用扩展方法获取所有子对象 总感觉获取个子对象还要用for循环有点麻烦,那么咱们就可以写一个扩展方法,直接获取到所有的子对象 1、首先新建一个MyExtensions.cs脚本 using System.Collections.Generic...List集合,一个是获取所有子对象的数组集合,按需使用。...3、使用扩展方法 使用m_ParObj.GetChild()就可以调用扩展方法: using System.Collections.Generic; using UnityEngine; public

    3.6K30

    AJAX的一个简单实例,跨域的解决,使用JQuery来进行ajax的调用

    1.什么是AJAX ajax(Asynchronous Javascript And XML),中文名为异步的js和xml。可以在不刷新网页的情况下与后台服务器进行通讯,加强用户的体验感。...是目前广泛使用的前端技术,下面将用原生js和JQuery来介绍一个简单的ajax实例。...2.一个简单的AJAX实例 get请求 // 采用原生的js代码(get请求) //1.实例化XMLHttpRequest对象 var request = new XMLHttpRequest(); /.../2.调用open方法,第一个参数为请求方式(get、post),第二个参数为请求地址,第三个参数为异步或者同步 request.open("GET", "请求url",true); //3.发送请求...}else { alert("错误"); } } } 3.采用JQuery内置的方法来调用

    7.3K10

    基于Metronic的Bootstrap开发框架经验总结(2)--列表分页处理和插件JSTree的使用

    ,介绍页面内容常用到的数据分页处理,以及Bootstrap插件JSTree的使用。...JSTree 控件的官方地址为https://www.jstree.com/ 网站对JSTree控件的使用说明及案例讲解的已经很清晰了,一般情况下,我们直接参考例子就可以使用了。...JStree控件选中节点的内容,然后进行相关的处理操作,那么它的处理代码如下所示。...EditTag(); }); 双击事件,其实是连续的单击事件处理,一般情况下,或先选中当前节点,我们也可以在双击的时候,获取对应的节点ID,如下代码所示。...ID,获取选择节点的名称则可以通过代码获取: var eventNodeName = e.target.nodeName; JSTree一般我们会通过JSON数据进行动态绑定,这个JSON的数据格式定义如下所示

    3K50

    51.Qt-使用ajax获取ashx接口的post数据

    由于当前C++项目需要使用ajax库去post调用ashx接口,接口地址如下所示: ? 需要传递的参数如下: ?...然后发现qml比较好调用ajax.js库,所以本章通过C++界面去获取qml方法来实现调用ashx接口(以一个C++界面demo程序为例) 1.抓post数据 通过网页获取到的post数据如下所示:...QML和widget类连接起来 engineObject = QQmlComponent(&engine, "qrc:/main.qml").create(); //创建qml并获取运行中的...: 将QML中的Widget变量指向为当前类.从而使QML和widget类连接起来, 然后main.qml如果post成功则调用当前类的invokeFunc(QVariant data1,QVariant...当按下同步按钮时,则调用on_pushButton_clicked(): 由于engineObject指向运行中的qml对象,然后我们通过invokeMethod()就可以方便的请求调用qml对象中的getWrenchTools

    2.6K30

    JS插件Fancytree使用分享及源码分析

    ,相比普通的jsTree,fancytree扩展的功能非常的多,除了checkbox选中,拖拽排序等基础的功能,还有节点过滤,即时编辑,tabletree(在列表中展示jstree),各种键盘事件,以及各种皮肤样式...(v.2.23.0) fancytree使用经验分享 1.插件的引入 传统引入的话,就是通过’script/link’标签去引入jq,jq-ui,和fancytree的js,css。...或者使用一些lazyload去引入这些文件也是同样的道理。...2.如果是以ajax获取数据资源,渲染tree,并且数据可变的状况下,需要对fancytree重新渲染,即: this.http.get({appId: this.stateParams.id}, url.coptApp...}) 3.获取选中节点数据 let selectTree = $("#treetable").fancytree("getTree").rootNode.children; 在选中fancytree的某一个节点后

    3.7K20

    jquery.ajax()怎么把获取来的内容转为JSON,并使用。

    现在越来越多的接口调用返回的数据类型为json数据类型,所以我们在写网页的时候通过AJAX调用数据的话可以通过设置JQ的属性 dataType : "json", 来设置返回数据的格式。...设置了这个属性之后我们就可以按JSON格式使用AJAX返回的内容。...中我们得到的 a 的内容为一个JSON字符串 {"errcode":xxx,"errmsg":"xxxxxxxxxxxxxx"}, 在浏览器的控制器中我们可以看到当触发AJAX时,控制器中返回一个数组。...这样就代表成功了,这时候我就就可以使用 a.errmsg 调用返回信息了。 但在微信小程序里面的wx.request 直接使用 a.data.errmsg这种方式就可以调用内容,不需要转换。...这样虽然你解析的时候可以解析出目录树,但在实际应用过程序会出现很多隐患,比如在小程序调用时只要格式稍有问题就会出错,而且还不报错。

    2.2K20

    使用JQuery、Ajax来调用WebService服务 基于Spring + CXF框架的Web Service

    基于Spring + CXF框架的Web Service 1、在之前的基础上修改的,如果想使用JQuery、Ajax来调用WebService服务,必须需要先获取到请求的参数值,我的参数值是下面的这部分...,如何获取到这参数值呢,只需要在客户端配置出拦截器即可,后台打印的参数,然后配置到自己需要的地方即可。...配置,这里还是使用账号密码验证服务,新增了出拦截器配置,其他还是使用上篇的类和配置。...配置,这里还是使用账号密码验证服务,新增了入拦截器配置,其他还是使用上篇的类和配置。...http://localhost:8080/webServiceCxf_Spring/orderws"); 101 // 如果是POST请求,要包含一个请求头,设置字符集编码,不然后台获取到的是乱码的

    2.6K20
    领券