Treegrid的動(dòng)態(tài)加載實(shí)例代碼
廢話不多說(shuō)了,直接給大家貼代碼了。
具體代碼如下所示:
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 : '編號(hào)', field : 'id', width : 150, hidden : true }, { field : 'text', title : '類別名稱', width : 200 } ] ], columns : [ [ { field : 'pname', title : '上級(jí)類別名稱', width : 80 },{ field : 'seq', title : '排序', width : 50 },{ field : 'code', title : '類別編碼', width : 50 }, { field : 'pid', title : '上級(jí)類別ID', width : 150, hidden : true }, { field : 'action', title : '動(dòng)作', 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 : '批量導(dǎo)入', iconCls : 'icon-remove', handler : function() { goods_type_importFun(); } },{ text : '增加', iconCls : 'icon-add', handler : function() { goods_type_appendFun(); } }, '-', { text : '展開(kāi)', 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){ //動(dòng)態(tài)設(shè)置展開(kāi)查詢的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") @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 // 緩存數(shù)據(jù) 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; }
相關(guān)文章
jqueryMobile 動(dòng)態(tài)添加元素,展示刷新視圖的實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇jqueryMobile 動(dòng)態(tài)添加元素,展示刷新視圖的實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05jQuery Raty星級(jí)評(píng)分插件使用方法實(shí)例分析
這篇文章主要介紹了jQuery Raty星級(jí)評(píng)分插件使用方法,結(jié)合實(shí)例形式分析了jquery Raty星級(jí)評(píng)分插件的下載、調(diào)用、基本屬性及相關(guān)使用技巧,需要的朋友可以參考下2019-11-11JQuery自定義事件的應(yīng)用 JQuery最佳實(shí)踐
本文主要介紹JQuery框架里面支持的自定義事件模型,通過(guò)實(shí)例說(shuō)明什么時(shí)候可以利用事件模型進(jìn)行面向?qū)ο蟮腏S編程,以及利用“帶命名空間的事件處理函數(shù)”來(lái)避免unbind時(shí)影響別的事件訂閱。2010-08-08在jquery中combobox多選的不兼容問(wèn)題總結(jié)
最近在IE10中開(kāi)發(fā)jquery,關(guān)于jquery中combobox多選不能兼容的問(wèn)題,進(jìn)行一些總結(jié),感興趣的朋友可以了解下2013-12-12jQuery實(shí)現(xiàn)網(wǎng)站添加高亮突出顯示效果的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)網(wǎng)站添加高亮突出顯示效果的方法,涉及jQuery針對(duì)頁(yè)面元素與樣式的操作技巧,需要的朋友可以參考下2015-06-06juqery 學(xué)習(xí)之三 選擇器 層級(jí) 基本
juqery 學(xué)習(xí)之三 選擇器 層級(jí) 基本,學(xué)習(xí)jquery的朋友可以參考下。2010-11-11jquery轉(zhuǎn)盤抽獎(jiǎng)功能實(shí)現(xiàn)
這篇文章主要介紹了jquery轉(zhuǎn)盤抽獎(jiǎng)功能實(shí)現(xiàn),實(shí)現(xiàn)的效果是九宮格大轉(zhuǎn)盤抽獎(jiǎng),應(yīng)用特別廣泛的轉(zhuǎn)盤抽獎(jiǎng)方式,感興趣的小伙伴們可以參考一下2015-11-11