TreeGrid初始化加载,(后台数据写入vm生成xml)

来源:互联网 发布:网店数据同步系统 编辑:程序博客网 时间:2024/05/30 02:25

由于TreeGrid使用的js文件是专业版的,因此此处直接引用js(可下载官方引用)(使用jquery之类的js引入文件略)

引入必要文件

<link rel="stylesheet" type="text/css" href="http://www.dhtmlx.com/docs/products/dhtmlxTreeGrid/samples/common/css/style.css"/><link rel="stylesheet" type="text/css" href="http://www.dhtmlx.com/docs/products/dhtmlxGrid/codebase/dhtmlxgrid.css"></link><link rel="stylesheet" type="text/css" href="http://www.dhtmlx.com/docs/products/dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_skyblue.css"></link><link rel="stylesheet" type="text/css" href="http://www.dhtmlx.com/docs/products/dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_blue.css"></link><script type="text/javascript" src="http://www.dhtmlx.com/docs/products/dhtmlxGrid/codebase/dhtmlxcommon.js"></script><script type="text/javascript" src="http://www.dhtmlx.com/docs/products/dhtmlxGrid/codebase/dhtmlxgrid.js"></script><script type="text/javascript" src="http://www.dhtmlx.com/docs/products/dhtmlxGrid/codebase/dhtmlxgridcell.js"></script><script type="text/javascript" src="http://www.dhtmlx.com/docs/products/dhtmlxTreeGrid/codebase/dhtmlxtreegrid.js"></script>

jsp页面中为treegrid写一个div

<div id="grid_samplelimit" style="width:570px;height:537px;background-color:white;"></div>

前台js实现初始化,加载等

                        var grid_sample;grid_sample = new dhtmlXGridObject('grid_samplelimit');grid_sample.selMultiRows = true;//grid_sample.imgURL = "http://www.dhtmlx.com/docs/products/dhtmlxGrid/codebase/imgs/icons_greenfolders/";//grid_sample.setHeader("Tree,Plain Text,Long Text,Color,Checkbox");grid_sample.setHeader("抗生素名称,抗生素结果1,抗生素结果2,范围");grid_sample.setInitWidths("120,90,90,90");grid_sample.setColAlign("left,left,left,left");grid_sample.setColTypes("tree,ed,txt,txt");grid_sample.setColSorting("str,str,str,str");grid_sample.init();//grid_sample.enableAutoHeight(true, "350");grid_sample.setImagePath("dhtmlxGrid/codebase/imgs/");grid_sample.setSkin("dhx_skyblue");//grid_sample.kidsXmlFile = "http://127.0.0.1:8080/his/file/test_list_2.xml";//grid_sample.loadXML("http://127.0.0.1:8080/his/file/test_list_1.xml");grid_sample.load("CheckOperate2/loadnoNRGrid.htm");setTimeout('grid_sample.expandAll()',1000);//默认展开全部节点

由于expandAll()的机制关系,不采用延迟函数setTimeout()可能不会默认全展开。

后台数据库取数据(db.find()为数据库操作类里的方法)

@RequestMapping("/loadnoNRGrid")public void loadnoNRGrid(HttpServletRequest req,HttpServletResponse response) throws IOException, ParseException {response.setContentType("text/xml;charset=utf-8");Bas_hospitals basHospitals = (Bas_hospitals) req.getSession().getAttribute("login_hospital");String hosnum = basHospitals.getHosnum();List<Map> list = new ArrayList<Map>();DBOperator db = null;try {db = new DBOperator();Date d1=new Date();PrintWriter pw = null;String sql="select * from result_micro w order by w.micro_data_id_name ";list=db.find(sql); //System.out.println(list.get(0).get("micro_data_id_name").toString());pw = response.getWriter();String vmpagckage = "com/cpinfo/his/template/lis/";String vmname ="treegrid.vm";String vm = VelocityUtils.generateGridVm(vmpagckage, vmname, "list", list);//System.out.println(vm);pw.print(vm);pw.flush();pw.close();db.commit();} catch (Exception e) {e.printStackTrace();db.rollback();} finally {db.freeCon();}}

vm文件代码如下:

<?xml version="1.0" encoding="UTF-8"?> <rows> #set($amt=0)#set($flag="")#set($var = $list.size())<userdata name="gud1"> userdata value 1 </userdata> <userdata name="gud2"> userdata value 2 </userdata> #foreach($!list in $list)#set($amt=$amt+1) #if($!list.micro_data_id_name!=$flag) #if($amt!=1)</row>#end #set($fla = $list.size()) #set($fla = $amt)<row id="$amt"><cell image="folder.gif">$!list.micro_data_id_name</cell><row id="$!list.micro_data_id2_name"><cell image="leaf.gif">$!list.micro_data_id2_name</cell><cell>$!list.micro_data_id2_result1</cell><cell>$!list.micro_data_id2_result2</cell><cell>$!list.micro_data_id2_range</cell></row>#else<row id="$!list.micro_data_id2_name"><cell image="leaf.gif">$!list.micro_data_id2_name</cell><cell>$!list.micro_data_id2_result1</cell><cell>$!list.micro_data_id2_result2</cell><cell>$!list.micro_data_id2_range</cell></row> #end #if($!list.micro_data_id_name!=$flag)#set($flag="$!list.micro_data_id_name")#if($amt!=$fla)</row>#end#end#if($amt==$var)</row>#end #end</rows> 

TreeGrid的执行效果