• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >jquery > 解析jquery easyui tree异步加载子节点问题

解析jquery easyui tree异步加载子节点问题

作者:龙果果 字体:[增加 减小] 来源:互联网

龙果果 通过本文主要向大家介绍了easyui,tree,异步加载,easyui,tree,异步,jquery,easyui,异步树等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

easyui中的树可以从标记中建立,也可以通过指定一个URL属性读取数据建立。如果想建立一棵异步树,需要为每个节点指定一个id属性值,这样在加载数据时会自动向后台传递id参数。

<ul id="tt"></ul>

编写前台代码:

$('#tt').tree({
  url:'/demo2/node/getNodes'  // The url will be mapped to NodeController class and getNodes method
});

为测试用,建立一个节点的数据模型:

@Table(name="nodes")
public class Node extends ActiveRecordBase{
  @Id public Integer id;
  @Column public Integer parentId;
  @Column public String name;
 
  public boolean hasChildren() throws Exception{
    long count = count(Node.class, "parentId=?", new Object[]{id});
    return count > 0;
  }
}

编写后台的控制器代码:

public class NodeController extends ApplicationController{
  /**
   * get nodes, if the 'id' parameter equals 0 then load the first level nodes,
   * otherwise load the children nodes
   * @param id the parent node id value
   * @return the tree required node json format
   * @throws Exception
   */
  public View getNodes(int id) throws Exception{
    List<Node> nodes = null;
 
    if (id == 0){  // return the first level nodes
      nodes = Node.findAll(Node.class, "parentId=0 or parentId is null", null);
    } else {  // return the children nodes
      nodes = Node.findAll(Node.class, "parentId=?", new Object[]{id});
    }
 
    List<Map<String,Object>> items = new ArrayList<Map<String,Object>>();
    for(Node node: nodes){
      Map<String,Object> item = new HashMap<String,Object>();
      item.put("id", node.id);
      item.put("text", node.name);
 
      // the node has children, 
      // set the state to 'closed' so the node can asynchronous load children nodes 
      if (node.hasChildren()){
        item.put("state", "closed");
      }
      items.add(item);
    }
 
    return new JsonView(items);
  }
}

官网例子地址:http://www.jeasyui.com/tutorial/tree/tree2.php

demo下载:easyui-tree2_jb51.rar 

重要的事情说三遍!!!

$('#tt').tree({
  method:"POST",
  url:'/demo2/node/getNodes'  // The url will be mapped to NodeController class and getNodes method
});

method一定要用POST,GET的话要在URL后面用一个变量来做时间戳处理。

method一定要用POST,GET的话要在URL后面用一个变量来做时间戳处理。

method一定要用POST,GET的话要在URL后面用一个变量来做时间戳处理。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • jQuery Easyui Treegrid实现显示checkbox功能
  • jQuery EasyUI的TreeGrid查询功能实现方法
  • EasyUI的TreeGrid的过滤功能的解决思路
  • Easyui和zTree两种方式分别实现树形下拉框
  • easyui-datagrid开发实践(总结)
  • 简述jQuery Easyui一些用法
  • jquery easyui如何实现格式化列
  • Easyui使用Dialog行内按钮布局的实例
  • easyui datagrid 表格中操作栏 按钮图标不显示的解决方法
  • easyui简介_动力节点Java学院整理

相关文章

  • jQuery自定义动画函数实例详解(附demo源码)
  • jquery获取下拉框中的循环值
  • jquery实现鼠标拖动图片效果示例代码
  • 关于setInterval、setTimeout在jQuery中的使用注意事项
  • jQuery控制文本框只能输入数字和字母及使用方法
  • jQuery实现鼠标选文字发新浪微博的方法
  • jQuery中after的两种用法实例
  • jQuery使用Selectator插件实现多选下拉列表过滤框(附源码下载)
  • JQuery 学习笔记 element属性控制
  • jquery 添加节点的几种方法介绍

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • jQuery实现切换页面布局使用介绍
    • jQuery中DOM操作实例分析
    • jquery获取一组checkbox的值(实例代码)
    • jQuery元素选择器实例代码
    • 基于jquery实现左右按钮点击的图片切换效果
    • validationEngine 表单验证插件使用实例代码
    • jquery简单实现鼠标经过导航条改变背景图
    • 7个有用的jQuery代码片段分享
    • 提高jQuery性能优化的技巧
    • jQuery模拟select实现下拉菜单功能

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有