jQuery MiniUI

标题: 树控件懒加载问题 [打印本页]

作者: nuangnian    时间: 2015-10-20 14:31:27     标题: 树控件懒加载问题

在树控件mini-tree使用懒加载时。如果返回数据有children形式的无效。如图:
[attach]6708[/attach]
当点击父节点,服务器返回上图数据。如果点击其中Base节点,应该展示它children内容的节点,但目前情况是点击base节点,又会发送请求到后台。
extjs框架懒加载中带有children的情况,它是会显示children内容,而不会又向服务器发请求

作者: felt    时间: 2015-10-20 15:27:07

我们的懒加载只支持加载一级的节点,不支持多级
作者: nuangnian    时间: 2015-10-20 15:49:21

felt 发表于 2015-10-20 15:27
我们的懒加载只支持加载一级的节点,不支持多级

那像这种情况我们在前端额外写js代码可以实现吗。我看到在生成树结构后,base节点里都没有它children信息了。
作者: felt    时间: 2015-10-20 16:10:16

nuangnian 发表于 2015-10-20 15:49
那像这种情况我们在前端额外写js代码可以实现吗。我看到在生成树结构后,base节点里都没有它children信息 ...

你这种需求只能自己用ajax来懒加载了
  1. <div class="mini-tree" id="tree1" style="width:300px;height:300px">
  2.           
  3.         </div>
  4. mini.parse();
  5.         var tree = mini.get("tree1");
  6.         tree.loadData([{id:1,text:"a",isLeaf:false,asyncLoad:false}])
  7.         tree.on("beforeexpand", function (e) {
  8.                 var cds = tree.getChildNodes(e.node);
  9.                //下面的数据是我模拟的,你可以通过同步的ajax去加载
  10.                 var nodes=[{id:e.node.id+"_1",text:e.node.text+"_1",isLeaf:false,asyncLoad:false,expanded:false}]
  11.                 if (cds.length < 1) {
  12.                         tree.addNodes(nodes, e.node);
  13.                 }
  14.         })       
复制代码

作者: nuangnian    时间: 2015-10-20 16:20:03

felt 发表于 2015-10-20 16:10
你这种需求只能自己用ajax来懒加载了

如果那个children可以保留到node中的话,我就可以每次点击节点的时候判断,如果存在children,就展示children的内容,否则就走后台。
作者: felt    时间: 2015-10-20 17:01:35

nuangnian 发表于 2015-10-20 16:20
如果那个children可以保留到node中的话,我就可以每次点击节点的时候判断,如果存在children,就展示chil ...

不支持你想的这种方式,请按我上面提供思路去处理
作者: nuangnian    时间: 2015-10-20 17:44:31

本帖最后由 nuangnian 于 2015-10-21 08:58 编辑
felt 发表于 2015-10-20 17:01
不支持你想的这种方式,请按我上面提供思路去处理

按照你说的方式实现了,但如果初始化的时候就打开root节点。以前懒加载可以通过
tree.loadNode(tree.getNode(rootId));方式实现,但现在失效了。
tree.expandLevel(0);也无效

除非在获取根节点之后,触发     beforeexpand事件
tree.doBeforeExpand();//无效
tree.expandNode(rootNode);然后展开

但是代码触发beforeexpand事件无效

作者: dforce    时间: 2015-10-21 09:39:34

nuangnian 发表于 2015-10-20 17:44
按照你说的方式实现了,但如果初始化的时候就打开root节点。以前懒加载可以通过
tree.loadNode(tree.getNo ...

js操作不会触发事件,也没什么dobeforeexpand方法,只有手动点击才有效
这样的方式loadNode肯定也没用的,都没url,哪来什么load加载
作者: nuangnian    时间: 2015-10-21 09:41:55

dforce 发表于 2015-10-21 09:39
js操作不会触发事件,也没什么dobeforeexpand方法,只有手动点击才有效
这样的方式loadNode肯定也没用的, ...

mini.get('controlName').doValueChanged();
这种值改变的有js触发
作者: dforce    时间: 2015-10-21 09:43:53

nuangnian 发表于 2015-10-21 09:41
mini.get('controlName').doValueChanged();
这种值改变的有js触发

但是并没有其他的事件可以这样触发,只有输入框类有doValueChanged这个特殊的方法
作者: nuangnian    时间: 2015-12-23 21:25:47

dforce 发表于 2015-10-21 09:43
但是并没有其他的事件可以这样触发,只有输入框类有doValueChanged这个特殊的方法 ...

tree.on("beforeexpand", function (e) {
                var cds = tree.getChildNodes(e.node);
               //下面的数据是我模拟的,你可以通过同步的ajax去加载
               var nodes=[{id:e.node.id+"_1",text:e.node.text+"_1",isLeaf:false,asyncLoad:false,expanded:false}]
                if (cds.length < 1) {
                     tree.addNodes(nodes, e.node);
                }
       })        
看到在miniui示例懒加载在点击节点前的+号时,会有转动效果

但通过上文提供的beforeexpand事件里加上
tree.addNodeCls(e.node, "mini-tree-loading");
没有转动样式
作者: felt    时间: 2015-12-24 09:41:01

nuangnian 发表于 2015-12-23 21:25
tree.on("beforeexpand", function (e) {
                var cds = tree.getChildNodes(e.node);
     ...

可以有这效果,请加到添加节点前




欢迎光临 jQuery MiniUI (http://miniui.com/discuss/) Powered by Discuz! X2