`
ronon
  • 浏览: 193639 次
  • 性别: Icon_minigender_2
  • 来自: 武汉
社区版块
存档分类
最新评论

EasyUI 编写实体类树状选择器

 
阅读更多
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>

<meta name="decorator" content="index" />
<body>

	<div class="portlet-body">
	   <table id="xxxdg" height="auto" width="100%"></table>
	</div>
<script type="text/javascript">
var trees = '${fns:getXXXListByTree()}'
var dg = $('#xxxdg').treegrid({

	method: 'post',
	rownumbers: true,
	idField: 'id',
	treeField: 'name',
	height:'500px',
	singleSelect : false,
	columns:[[
		{field:'id',title:'编号',hidden:true},
		{field:'name',title:'名称',width:240,sortable:true,formatter:formatterData},
		{field:'description',title:'描述',width:150,align:'center'},
	]]
});

//变量trees的值是符合treegrid要求的json格式的字符串
var data =$.parseJSON('{"total":0,"rows":'+ trees +'}');  
dg.treegrid('loadData', data); //将数据绑定到treegrid 


function formatterData(value,rowData,rowIndex){
	 //rowData是当节点的数据集,children表示其分支,如果!=undefined则表示当前节点有分支,由于这个树只有两层,也表示它就是父节点。如果是父节点,就不在后面加checkbox
	 if(rowData.children != undefined){
		 return rowData.name;
	 }else{
                 //在调用当前jsp时用url传值的形式传过来的sortids变量
		 var sortIds = '${param.sortIds}';
		 var checked = "";
		 if(sortIds!="")
		 {
			 if(sortIds.indexOf(rowData.id) > -1){
				 checked = "checked='checked'";	 
			 }
		 }
                 //将checkbox动态拼在名称前
		 return "<input "+checked+"type='checkbox' id='ids_"+rowData.id+"' value='values_"+rowData.name+"'>" + rowData.name;
	 }
}




</script>
</body>

 

分享到:
评论

相关推荐

    easyui 日期选择器

    EasyUI 提供了一些事件来监听日期选择器的操作,如`onOpen`(打开日期选择器时触发)、`onClose`(关闭日期选择器时触发)等。开发者可以根据需求编写相应的事件处理函数。 ```html &lt;input type="text" class="...

    基于easyui-textbox的颜色选择器及源码

    本文将深入探讨基于EasyUI的TextBox颜色选择器及其源码,帮助开发者理解这一组件的工作原理并实现自定义功能。 EasyUI是一个基于jQuery的轻量级前端框架,它提供了丰富的UI组件,使得开发者可以快速构建出美观、...

    前端easyUI日期选择器(日/周/月)示例

    前端jquery+easyUI实现的日期选择器。 博文地址:https://blog.csdn.net/wanghuiWHI/article/details/135648572 Demo简要: 1.日期选择器可以提供日选择器、周选择器、月选择器 2.日选择器最大31天,选择起始日期后...

    easyui 树形结构样例

    总结来说,"easyui 树形结构样例"涉及到EasyUI的`tree`和`combobox`组件的综合运用,通过定制`combobox`的下拉面板,实现树形结构数据在下拉框内的展示,为用户提供更直观、丰富的选择体验。在实际应用中,还可以...

    jquery easyui 周历 周选择下拉控件

    1. **扩展EasyUI组件**:通过编写JavaScript代码,继承EasyUI的datebox组件,增加新的属性和方法来处理周选择。 2. **样式设计**:根据需求定制日期显示格式,使其以周为单位展示,同时确保样式与EasyUI主题保持一致...

    SSH+Easyui之TreeGrid树形展现数据

    3. **Hibernate DAO**:编写DAO类,使用HQL或SQL查询数据库,获取树形数据。 4. **数据转换为JSON**:将Service层获取的数据转换为JSON格式,可以使用Jackson或Gson等库进行转换。 5. **EasyUI TreeGrid配置**:在...

    Easyui 树形控件展示

    EasyUI 是一个基于 jQuery 的轻量级前端框架,它提供了丰富的组件,包括表格、对话框、菜单、按钮、树形控件等,帮助开发者快速构建用户界面。在本主题中,我们将深入探讨“EasyUI 树形控件展示”及其在实际应用中的...

    easyui 日期控件选择到月份

    easyui日期控件只选择到月份,保存记录一下。 &lt;input id="month" class="easyui-datetimebox" name="month" data-options="required:true,formatter:myformatter,parser:myParser" 160px" /&gt;

    easyui树形菜单操作

    在本案例中,我们将聚焦于 "easyui 树形菜单操作",特别是在 ASP.NET 中的动态绑定。树形菜单是一种常见的用户界面元素,用于展示具有层级关系的数据,如目录结构、组织架构等。 1. **EasyUI Tree 控件** EasyUI ...

    科发EasyUi代码生成器v3.5

    EasyUI的核心组件包括表格、表单、按钮、对话框、菜单、树形视图、面板、布局等,而科发EasyUi代码生成器能帮助开发者快速生成与这些组件交互的代码。例如,它可以自动生成用于数据展示的表格,用户操作的按钮,以及...

    使用easyUI实现树菜单

    在本文中,我们将深入探讨如何使用EasyUI框架来实现一个动态的树形菜单。EasyUI是一个基于jQuery的轻量级前端开发框架,它提供了一系列组件,包括表格、对话框、菜单等,使得开发者能够快速构建用户界面。在这个场景...

    easyui- Jquery两种颜色选择器

    jQuery ColorPicker颜色选择器【网页取色器】,有的也称拾色器,总之它是运行在网页上截取屏幕颜色值的小工具,可以把某点的颜色值转换至对应格式传入需要的地方。ColorPicker基于强大的jQuery,使用方便、配置简单...

    easyui级联选择

    通过服务器后台传来的json数据,进行前台组织或人员的选择

    easyui树 改变联动关系,选择父,同时选择子;子全部取消,父不取消

    总的来说,"easyui树 改变联动关系,选择父,同时选择子;子全部取消,父不取消"这个主题涉及到EasyUI树组件的联动特性定制,以及如何使用JSON数据加载树结构。在实际项目中,这样的功能可以提供更加灵活和符合用户预期...

    easyUI-树形表格(TreeGrid)实现无限层级菜单

    树形表格(TreeGrid)是EasyUI中的一个特色组件,它结合了表格和树状结构的特点,允许数据以层级方式展示,常用于组织结构、目录结构等场景。在实现无限层级菜单时,我们需要考虑如何动态加载子节点以及如何进行数据...

    spring+springMVC+hibernate+easyUI编写的一个预约demo

    - 配置Hibernate:创建实体类,编写映射文件或使用注解进行ORM配置,设置数据源和SessionFactory。 - 创建数据库表:根据实体类创建对应的数据库表结构。 - 编写业务逻辑:在Service层实现预约的业务规则,如检查...

    easyui从一个treegrid树形网格往另一个树形网格拖放数据

    下载easyui后使用其中的css和js,从一个treegrid树形网格资源 往另一个空的树形网格拖放数据,支持添加子节点、删除、编辑、保存、取消编辑、刷新、更新数据等功能

    easyUI标签生成工具

    3. 选择实体类:在工具中选择需要生成界面的实体类。 4. 生成代码:点击生成按钮,工具会自动生成对应的HTML页面(包括datagrid列表、新增和编辑表单)、JavaScript代码以及可能的后台处理逻辑。 5. 整合到项目:将...

    easyui_combotree_search

    3. **Combotree**:EasyUI的Combotree组件是将下拉列表和树形结构相结合的控件,通常用于选择层级关系的数据。用户可以通过输入关键词进行搜索,然后在下拉列表中展示匹配的树形结构,方便用户快速找到目标节点。...

    JAVA实现EASYUI树形表格(TreeGrid)代码

    JAVA实现EASYUI树形表格(TreeGrid)代码,gradle项目,内含gradle文件夹和mysql数据库文件,解压后导入mysql数据库,文件夹导入eclipse即可使用。首次使用请更新gradle项目下载JAR包,不然报错。

Global site tag (gtag.js) - Google Analytics