easyUI的treegrid添加节点(append)时间过长,设置等待(wait)遮罩效果

在easyUI的treegrid中批量添加节点时,由于耗时较长可能导致用户体验不佳。原有机制仅在数据加载时显示loadMsg,而添加节点无此功能。通过自定义函数`_loadwaiting`和`_removeloading`,实现了添加节点过程中的等待遮罩效果,以提高用户体验。利用setTimeout模拟异步操作,确保在复制节点完成后隐藏等待信息。
摘要由CSDN通过智能技术生成
               

如题所述,在treegrid中,一次添加多个节点时,时间很长,但easyUI并无显示等待信息,让人以为是陷入了死循环,或者死机了,用户体验很差。

本来,treegrid(或者datagrid)有所谓的loadMsg,但只在加载数据时显示。添加节点,则不见有这种机制。

只能自己动手,丰衣足食了。

像很多次寻找答案一样,在网上搜索了许久,基本上都是一些互相抄袭,似是而非,不知所谓的垃圾。作者煞有介事地这样说,但有没有实际应用过,到底行不行,很让人怀疑。

或者只贴一点代码,缺乏足够的解释,让人变成丈二金刚。

经过一番努力,终于达到我自己想要的效果:

从一棵树中选中了许多节点,一次性复制到另一棵树。期间耗时比较长,会先显示等待信息;添加完成以后,等待消息消失。

没有代码我说个J8:


应用场景:

easyUI的一个对话框:

<div id="dlg_Add_template" class="easyui-dialog"   style=" width:600px; ">……</div><script 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
easyui treegrid 提供了树节点延迟加载的功能,可以将树节点的数据分批加载,只有当用户展开该节点时,才会加载该节点的子节点。下面是使用树节点延迟加载的示例代码: 1. 首先,在 easyui treegrid 的 data 属性中,需要为每个节点添加一个 "state" 属性,该属性的值为 "closed",表示该节点的子节点未加载。例如: ``` var data = [ { "id": 1, "text": "Node 1", "state": "closed" }, { "id": 2, "text": "Node 2", "state": "closed" } ]; ``` 2. 然后,在 easyui treegrid 的 onBeforeExpand 事件中,判断该节点是否已经加载子节点,如果未加载,则通过 AJAX 请求获取该节点的子节点数据,并将数据添加到该节点下。例如: ``` $('#treegrid').treegrid({ url: 'get_data.php', idField: 'id', treeField: 'text', onBeforeExpand: function(row) { if (row.children == undefined) { $.ajax({ url: 'get_children.php?id=' + row.id, dataType: 'json', success: function(data) { $('#treegrid').treegrid('append', { parent: row.id, data: data }); row.children = data; } }); } }, columns: [...] }); ``` 在这个示例代码中,通过 AJAX 请求获取该节点的子节点数据,并通过 treegrid 的 "append" 方法将数据添加到该节点下。同时,为了避免多次请求同一个节点的子节点数据,需要将已经加载的子节点数据保存在该节点的 "children" 属性中。 通过以上代码,你就可以实现 easyui treegrid 的树节点延迟加载功能。当用户展开某个节点时,会自动请求该节点的子节点数据,并将数据添加到该节点下,从而实现了分批加载数据的效果,提高了 easyui treegrid 的性能。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值