Treegrid的動態載入執行個體代碼_jquery

廢話不多說了，直接給大家貼代碼了。

具體代碼如下所示：

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 onclick="goods_type_editFun(\'{0}\');" src="{1}"/> <img onclick="goods_type_deleteFun(\'{2}\');" src="{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 id="goods_type_treegrid"></table>

2、controller

@RequestMapping("/treegrid")@ResponseBodypublic 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;}