zoukankan      html  css  js  c++  java
  • jquery EasyUi 添加节点、展开所有节点、默认选中第一个节点

    感觉easyUi 的树用起来不如 Ext 的树方便,首先,root节点不太好自定义,

    异步加载时,只能通过后台判断生成root节点,但是这样一来有一个问题,就是第一次访问界面时,

    树的初始化比较慢,大概会有一秒左右的时间,树是空白的,虽然只有一秒左右的时间,但是对于我来说是没有办法容忍的,所以,我是用 ajax 的方法通过append 将子节点加入进去,然后展开所有节点,并且默认选择第一个子节点


    下面是 js 代码


    			$(document).ready(function(){
    				$("#tree").tree({
    					data: [{
    						text: '主目录',
    						state: 'closed'
    					}],
    					onSelect: function(selectNode){
    						console.log("select: " + selectNode.id);
    					}
    				});
    				
    				$.ajax({
    					type : "POST",
    					dataType : "json",
    					url : "testAction_loadTree",
    					success : function(data){
    						var rootNode = $("#tree").tree('getRoot');
    						/* 向root添加子节点 */
    						$("#tree").tree('append',{
    							parent: rootNode.target,
    							data: data
    						});
    						
    						/* 展开所有节点 */
    						$("#tree").tree('expandAll');
    						
    						var children = $("#tree").tree('getChildren',rootNode.target);
    						
    						/* 选中第一个子节点 */
    						$("#tree").tree("select",children[0].target);
    					}
    				});
    			});

    ajax 通过后台传递的json数据格式为:


    [{"id":"D:\lucene\file5\index","state":"open","text":"D:\lucene\file5\index"},{"id":"D:\lucene\file5\indexwa","state":"open","text":"D:\lucene\file5\indexwa"},{"id":"D:\lucene\file5\index_tmp","state":"open","text":"D:\lucene\file5\index_tmp"},{"id":"D:\lucene\file5\spider","state":"open","text":"D:\lucene\file5\spider"}]

    json 是通过fastJson 这个开源的java 工具实现的,挺好用的,在此推荐一下



  • 相关阅读:
    Oracle学习 第25天 Oracle版的Profiler
    Oracle学习 第24天 .net EF连Oracle
    项目中各子系统之间数据交互的方法总结与心得
    Python学习 第7天 爬虫-1 构思
    Oracle学习 第23天 Oracle视图、表、SqlServer、excel、csv的互导
    Python学习 第6天 类、模块、包
    Python学习 第5天 函数
    Javascript/Jquery实现日期前一天后一天
    Javascript/Jquery遇到字符串自动NaN的问题
    Eclipse打包jar
  • 原文地址:https://www.cnblogs.com/moonciki/p/8145853.html
Copyright © 2011-2022 走看看