Treegrid的动态加载实例代码

废话不多说了，直接给大家贴代码了。

具体代码如下所示：

1、前端

<%@ page language="java" pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"%> <script type="text/javascript"> $(function() { $('#goods_type_treegrid').treegrid({ url : '${pageContext.request.contextPath}/admin/goodsTypeController/treegrid.do?id=NULL', idField : 'id', treeField : 'text', rownumbers: true, parentField : 'pid', fit : true, fitColumns : true, border : false, frozenColumns : [ [ { title : '编号', field : 'id', width : 150, hidden : true }, { field : 'text', title : '类别名称', width : 200 } ] ], columns : [ [ { field : 'pname', title : '上级类别名称', width : 80 },{ field : 'seq', title : '排序', width : 50 },{ field : 'code', title : '类别编码', width : 50 }, { field : 'pid', title : '上级类别ID', width : 150, hidden : true }, { field : 'action', title : '动作', width : 50, formatter : function(value, row, index) { return formatString('<img src="https://www.jb51.net/article/{1}"/>&nbsp;<img src="https://www.jb51.net/article/{3}"/>', row.id, '${pageContext.request.contextPath}/style/images/extjs_icons/pencil.png', row.id, '${pageContext.request.contextPath}/style/images/extjs_icons/cancel.png'); } } ] ], toolbar : [ { text : '批量导入', iconCls : 'icon-remove', handler : function() { goods_type_importFun(); } },{ text : '增加', iconCls : 'icon-add', handler : function() { goods_type_appendFun(); } }, '-', { text : '展开', iconCls : 'icon-redo', handler : function() { var node = $('#goods_type_treegrid').treegrid('getSelected'); if (node) { $('#goods_type_treegrid').treegrid('expandAll', node.cid); } else { $('#goods_type_treegrid').treegrid('expandAll'); } } }, '-', { text : '折叠', iconCls : 'icon-undo', handler : function() { var node = $('#goods_type_treegrid').treegrid('getSelected'); if (node) { $('#goods_type_treegrid').treegrid('collapseAll', node.cid); } else { $('#goods_type_treegrid').treegrid('collapseAll'); } } }, '-', { text : '刷新', iconCls : 'icon-reload', handler : function() { $('#goods_type_treegrid').treegrid('reload'); } } ], onBeforeExpand:function(row){ //动态设置展开查询的url var url = '${pageContext.request.contextPath}/admin/goodsTypeController/treegrid.do'; $("#goods_type_treegrid").treegrid("options").url = url; return true; }, onContextMenu : function(e, row) { e.preventDefault(); $(this).treegrid('unselectAll'); $(this).treegrid('select', row.id); $('#goods_type_menu').menu('show', { left : e.pageX, top : e.pageY }); }, onExpand : function(row){ var children = $("#goods_type_treegrid").treegrid('getChildren',row.id); if(children.length<=0){ row.leaf=true; $("#goods_type_treegrid").treegrid('refresh', row.id); } } }); }); </script> <table></table>

2、controller

@RequestMapping("/treegrid") @ResponseBody public List<GoodsTypePage> treegrid(GoodsTypePage goodsTypePage) { if(null==goodsTypePage || "".equals(goodsTypePage.getId()) || null == goodsTypePage.getId()){ goodsTypePage.setId("NULL"); } return goodsTypeService.treegrid(goodsTypePage); }

3、service

@Override // 缓存数据 public List<GoodsTypePage> treegrid(GoodsTypePage goodsTypePage) { String hql = ""; if(null==goodsTypePage || "".equals(goodsTypePage.getId()) || "NULL".equals(goodsTypePage.getId())){ hql = "from GoodsType t where t.tgoodstype.id is NULL order by t.seq"; }else{ hql = "from GoodsType t where t.tgoodstype.id = '" +goodsTypePage.getId()+"' order by t.seq"; } List<GoodsType> brList = goodsTypeDao.find(hql); List<GoodsTypePage> nl = new ArrayList<GoodsTypePage>(); if (brList != null && brList.size() > 0) { for (GoodsType br : brList) { GoodsTypePage r = new GoodsTypePage(); BeanUtils.copyProperties(br, r); if(br.getTgoodstype()!=null){ r.setPname(br.getTgoodstype().getText()); r.setPid(br.getTgoodstype().getId()); } r.setState("closed"); nl.add(r); } } return nl; }

您可能感兴趣的文章: