雷林鹏分享：jQuery EasyUI 树形菜单 - 树形网格惰性加载节点

迷南。 2021-09-30 01:04 338阅读 0赞

jQuery EasyUI 树形菜单 - 树形网格惰性加载节点

有时我们已经得到充分的分层树形网格(TreeGrid)的数据。 我们还想让树形网格(TreeGrid)按层次惰性加载节点。 首先，只加载顶层节点。 然后点击节点的展开图标来加载它的子节点。 本教程展示如何创建带有惰性加载特性的树形网格(TreeGrid)。

![treegrid5.png][]

创建树形网格(TreeGrid)

data-options="

url: 'data/treegrid\_data.json',

method: 'get',

rownumbers: true,

idField: 'id',

treeField: 'name',

loadFilter: myLoadFilter

">

为了放置加载子节点，我们需要为每个节点重命名 'children' 属性。 正如下面的代码所示，'children' 属性重命名为 'children1'。 当展开一个节点时，我们调用 'append' 方法来加载它的子节点数据。

'loadFilter' 代码

function myLoadFilter(data,parentId)\{

function setData()\{

var todo = \[\];

for(var i=0; i<data.length; p="" i++)\{<="">

todo.push(data\[i\]);

\}

while(todo.length)\{

var node = todo.shift();

if (node.children)\{

node.state = 'closed';

node.children1 = node.children;

node.children = undefined;

todo = todo.concat(node.children1);

\}

\}

\}

setData(data);

var tg = $(this);

var opts = tg.treegrid('options');

opts.onBeforeExpand = function(row)\{

if (row.children1)\{

tg.treegrid('append',\{

parent: row\[opts.idField\],

data: row.children1

\});

row.children1 = undefined;

tg.treegrid('expand', row\[opts.idField\]);

\}

return row.children1 == undefined;

\};

return data;

\}

下载 jQuery EasyUI 实例

jeasyui-tree-treegrid5.zip

本文转载自：w3cschool(编辑：雷林鹏 来源：网络 侵删)

转载于:https://www.cnblogs.com/pengpeng1208/p/10648443.html

[treegrid5.png]: http://www.w3cschool.cc/wp-content/uploads/2013/12/treegrid5.png

发表评论取消回复

表情：

评论列表（有 0 条评论，338人围观）

还没有评论，来说两句吧...

相关阅读

相关 easyui树形菜单实现

![815622-20180809134106370-1515825099.png][] ![815622-20180809134229274-654427617.png][

缺乏、安全感/ 2023年06月10日 09:27/ 0 赞/ 103 阅读

相关《easyUI的树形菜单》

1：dao方法 package com.zy.dao; import java.sql.SQLException; import java.

清疚/ 2022年05月10日 02:33/ 0 赞/ 286 阅读

相关雷林鹏分享：CodeIgniter 转义查询

　　CodeIgniter 框架提供了 Active Record 模式来对数据库进行操作，自己也比较喜欢这种操作数据库的方式，因为通过这种方式进行数据库操作系统会自动对数据进

亦凉/ 2022年01月11日 06:09/ 0 赞/ 350 阅读

相关雷林鹏分享：PHP $_POST 变量

　　在 PHP 中，预定义的 $\_POST 变量用于收集来自 method="post" 的表单中的值。　　$\_POST 变量　　预定义的 $\_POST 变量用于

蔚落/ 2021年12月22日 12:53/ 0 赞/ 306 阅读

相关雷林鹏分享：PHP 数组

　　数组能够在单个变量中存储多个值：　　　　$cars=array("Volvo","BMW","Toyota"); 　　echo "I like " . $cars

今天药忘吃喽~/ 2021年12月22日 12:53/ 0 赞/ 382 阅读

相关雷林鹏分享：CSS 字体

　　CSS字体属性定义字体，加粗，大小，文字样式。　　serif和sans-serif字体之间的区别 ![Serif vs. Sans-serif][]![Remark]

比眉伴天荒/ 2021年12月01日 16:34/ 0 赞/ 414 阅读

相关雷林鹏分享：Lua 函数

　　在Lua中，函数是对语句和表达式进行抽象的主要方法。既可以用来处理一些特殊的工作，也可以用来计算一些值。　　Lua 提供了许多的内建函数，你可以很方便的在程序中调用它们

矫情吗；*/ 2021年12月01日 16:31/ 0 赞/ 292 阅读

相关雷林鹏分享：jQuery EasyUI 菜单与按钮 - 创建分割按钮

　　jQuery EasyUI 菜单与按钮 - 创建分割按钮(Split Button) 　　分割按钮(Split Button)包含一个链接按钮(Link Button)和

超、凢脫俗/ 2021年11月19日 14:30/ 0 赞/ 396 阅读

相关雷林鹏分享：Redis HyperLogLog

　　Redis 在 2.8.9 版本添加了 HyperLogLog 结构。　　Redis HyperLogLog 是用来做基数统计的算法，HyperLogLog 的优点是，

亦凉/ 2021年10月18日 18:48/ 0 赞/ 395 阅读

相关雷林鹏分享：jQuery EasyUI 树形菜单 - 树形网格惰性加载节点

　　jQuery EasyUI 树形菜单 - 树形网格惰性加载节点　　有时我们已经得到充分的分层树形网格(TreeGrid)的数据。我们还想让树形网格(TreeGrid)

迷南。/ 2021年09月30日 01:04/ 0 赞/ 339 阅读