`

easyui中combotree异步加载的一些问题

阅读更多

1. 先是前台js请求

  
    // 上级部门下拉列表
	$('#department').combotree({
		url : 'departmentMaintainAction!queryDepartmentTree.action',
		valueField : 'id',
		textField : 'text',
		required : true,
		editable : false,
		onClick : function(node) {
			if (node.attributes.url) {
				insertTab(node);
			}
		},
//全部展开
		onLoadSuccess : function(node, data) {
			var t = $(this);
			if (data) {
				$(data).each(function(index, d) {
					if (this.state == 'closed') {
						t.tree('expandAll');
					}
				});
			}
		}
	});
     
   


2. 后台json

  
        
	JSONArray jsonArrayIn = new JSONArray();
		for (Department department : departmentList) {
			JSONObject jsonObject = new JSONObject();
			jsonObject.put("id", department.getDptId());
			jsonObject.put("text", department.getBmmc());
       //[color=blue] 注意这里的state很重要,combotree就是根据state
       // 的值来判断是否向后台再次请求子节点数据,       
       // 同时它还向后台传递了该节点的id值,作为后台查询依据[/color]

			if(department.getIsLeaf().equals("0")){
				jsonObject.put("state", "closed");
			}else {
				jsonObject.put("state", "open");
			}
			
			jsonArrayIn.put(jsonObject);
		}
   


3. 后台数据查询需要注意的是

  
        //combotree自动返回的父节点id,这是关键
         String id = request.getParameter("id");
         if(id != null){
	   department.setDptId(id);
	  }    
   

  
    //这是dao中的处理
    if(department.getDptId() == null){
         sql.append("and parent_id is null order by seq asc");
 	 query = this.getSession().createQuery(sql.toString());
     }else{
         sql.append("and parent_id = :parent_id order by seq asc");
    	 query = this.getSession().createQuery(sql.toString());
         query.setParameter("parent_id", department.getDptId());
     }
  
分享到:
评论

相关推荐

    jquery-easyui_combotree异步树的生成代码

    在给定的代码片段中,我们可以看到一个完整的Combotree异步加载实现: ```javascript $(function(){ // Combotree 初始化 $('#combotree1').combotree({ url: '/get_rootnode.do', // 初始时只获取根节点 '...

    Java>jquery-easyui_combotree异步树的生成代码示例(NEW)

    本文档将详细介绍如何利用jQuery EasyUI中的Combotree实现异步加载树形结构,并提供一个完整的示例。 #### 二、理解Combotree与异步树的概念 1. **Combotree简介**: - Combotree是jQuery EasyUI框架中的一个组合...

    easyui_combotree_search

    在"easyui_combotree_search"项目中,jQuery是基础,用于处理页面元素的交互和动态效果。 2. **EasyUI**:EasyUI是基于jQuery的UI框架,提供了丰富的组件,如对话框、表格、下拉列表、树形控件等,极大地提高了开发...

    jquery-easyui_combotree异步树的生成代码示例(NEW)

    下面将详细介绍如何使用 jQuery EasyUI 实现 Combotree 的异步加载功能。 ##### 3.1 HTML 结构 首先,我们需要定义一个 `<input>` 元素作为 Combotree 的容器,并为其设置初始值: ```html <input id="combotree1...

    EasyUi combotree 实现动态加载树节点

    在 EasyUi 的 Combotree 中实现动态加载树节点,主要是通过监听 `onBeforeExpand` 事件来实现的。当用户尝试展开一个节点时,这个事件会被触发。在事件处理函数中,我们可以修改内置 Tree 控件的 `options.url`,使...

    Easyui combotree idField扩展Demo

    在实际开发中,我们可能还会遇到其他定制需求,比如加载数据的异步处理、节点的展开与折叠事件监听、搜索功能的实现等。这些都可以通过 combotree 提供的各种方法和事件来实现,如 `loadData` 方法用于动态加载数据...

    Jquery EasyUI 异步树,适合大数据量无限级加载

    jQuery EasyUI 提供的 `tree` 组件支持异步加载,这对于处理大数据量的无限级树状结构尤为适用。实现这一功能的关键在于配置 `url` 属性,该属性指定了获取子节点数据的服务器端接口。例如,在提供的 `TreeJsonData....

    easyui 异步树

    1. **异步加载树结构**: 异步树结构主要应用于那些数据量大或者层级深的场景,避免一次性加载所有节点导致页面卡顿。EasyUI 提供了两种主要的异步树组件:`combotree` 和 `treegrid`。 2. **Combotree(树形...

    Easyui Mvc结合使用实例

    在Asp.net MVC中,可以使用AjaxHelper或者jQuery的$.ajax方法与服务器进行异步通信,这在EasyUI中尤为常见,因为它支持数据的动态加载和分页。例如,你可以在控制器中创建一个Action,该Action返回JsonResult,包含...

    EasyUI tutorial 中文版 chm

    easyUI 根据一些条件改变DataGrid 行背景颜色 easyUI 创建一个 Property Grid easyUI 展开DataGrid里面的行显示详细信息 easyUI 在主datagrid上创建子datagrid Window easyUI 我的第一个window easyUI ...

    easyui资料

    这里面包含easyui的chm文档easyui-1.3.5.zip,datagrid项目案例,SSH和easyui整合的案例,easyui异步加载tree,tree和datagrid共用的例子,改好的兼容jQueryUI1.10.3的easyui,另外加一个primeui-10资料。资源分定为1分...

    easyui1.4中文文档

    Tree组件用于展示层次结构的数据,可以展开/折叠节点,支持异步加载数据。可以与其他组件结合,如用作选择器或导航。 6. **下拉树(Combotree)** Combotree是下拉框和树的组合,用户可以选择一个或多个树节点...

    jquery-easyui中文AIP文档

    7. **树形视图(Tree)**: Tree组件用于展示层次结构的数据,可以展开和折叠节点,支持异步加载和图标自定义。 8. **下拉树(ComboBox/ComboboxTree)**: ComboBox 是一个组合框,结合了输入框和下拉列表,...

    jQuery EasyUI 1.4.2 版 API 中文版

    API中讲解了如何设置下拉选项、异步加载数据及触发事件。 3. **TreeGrid**: 树形数据网格结合了树和表格的特点,可以展示层次化的数据。API中包含如何创建树节点、展开折叠、异步加载等内容。 4. **Dialog**: ...

    jquery easyui

    5. **easyui-tree (树形结构)**:`easyui-tree` 用于展示层次结构的数据,可以进行展开、折叠操作,支持异步加载数据。开发者可以通过API进行节点的添加、删除、选中等操作。 6. **easyui-datagrid (表格)**:`...

    easyui视频教程

    5. 动态加载和异步通信:利用Ajax技术实现组件的动态更新和数据的异步加载。 6. 响应式布局:了解如何使EasyUI组件适应不同设备和屏幕尺寸。 7. 自定义样式:根据需求调整EasyUI默认样式,实现个性化界面设计。 8. ...

    jquery-easyui-1.3.5 中文离线API

    EasyUI 的核心在于它的组件系统,这些组件包括但不限于:对话框(dialog)、表格(datagrid)、表单(form)、菜单(menu)、工具栏(toolbar)、树形控件(tree)、下拉树(combotree)、下拉列表(combobox)等。...

    easyui框架主要代码

    - **Ajax**:EasyUI 使用 jQuery 的 Ajax 方法与服务器进行异步通信,获取或更新数据。 - **JSON**:通常,数据以 JSON 格式在前后端之间传输,EasyUI 可以方便地解析 JSON 数据并填充到组件中。 4. **EasyUI ...

    easyui.rar_easyui

    5. **Ajax 功能**:EasyUI 可以与后台进行异步交互,实现数据的动态加载和提交。 6. **主题和样式**:EasyUI 支持多种预定义的主题,允许开发者根据需要定制界面风格。 7. **示例代码**:每个控件通常都会有一个或...

    easyui1.4.5文档,jquery文档和源码

    3. **数据绑定**:EasyUI与jQuery的数据绑定机制相结合,可以轻松地将后台数据动态加载到前端组件中。例如,使用`datagrid`时,可以通过Ajax从服务器获取数据并自动填充到表格中。 4. **事件处理**:EasyUI组件支持...

Global site tag (gtag.js) - Google Analytics