//实体类
import java.util.ArrayList; public class ObjectType { private String type; private ArrayList<SubObjectType> subObjects; public String getType() { return type; } public void setType(String type) { this.type = type; } public ArrayList<SubObjectType> getSubObjects() { return subObjects; } public void setSubObjects(ArrayList<SubObjectType> subObjects) { this.subObjects = subObjects; } }
public class SubObjectType { private String subtype; private double fileCount; private double bytes; private String timeRange; public String getSubtype() { return subtype; } public void setSubtype(String subtype) { this.subtype = subtype; } public double getFileCount() { return fileCount; } public void setFileCount(double fileCount) { this.fileCount = fileCount; } public double getBytes() { return bytes; } public void setBytes(double bytes) { this.bytes = bytes; } public String getTimeRange() { return timeRange; } public void setTimeRange(String timeRange) { this.timeRange = timeRange; } }
2.servlet:得到一个对象列表ArrayList<T>,将其转化为jsonArray
AccountInfoDao dao = new AccountInfoDao(); ArrayList<ObjectType> objectTypes = new ArrayList<ObjectType>(); objectTypes = dao.load(); JSONObject jsonObject = new JSONObject(); jsonObject.put("categorys", objectTypes); JSONArray jsonArray = new JSONArray(); jsonArray.add(jsonObject); System.out.println(jsonArray); PrintWriter out = response.getWriter(); out.write(jsonArray.toString());
3.js处理
function load(){ $.ajax({ type:"post",//请求方式 url:"servlet/AccountInfo",//发送请求地址 dataType:"json", data:{//发送给数据库的数据 }, //请求成功后的回调函数有两个参数 success:function(data,textStatus){ var objs=eval(data); //解析json对象 var obj = objs[0]; var table = $("#table"); table.empty(); table.append('<tr><th></th><th>类别</th><th>文件个数</th><th>文件大小</th><th>时间范围</th></tr>'); if(obj==null || obj==""){ table.append('<tr><td colspan="5" style="text-align: center; color:red">暂无数据!</td></tr>') //$("#page").hide(); return false; } var categorys = obj.categorys; for(var i=0;i<categorys.length;i++){ var type = categorys[i].type; var subObjects = categorys[i].subObjects; var len = subObjects.length; table.append('<tr><td rowspan="'+len+'">'+type+'</td>'+'<td>'+subObjects[0].subtype+'</td>'+'<td>'+subObjects[0].fileCount+'</td>'+'<td>'+subObjects[0].bytes+'</td>'+'<td>'+subObjects[0].timeRange+'</td></tr>') //table.append('<td>'+subObjects[0].subtype+'</td>'+'<td>'+subObjects[0].fileCount+'</td>'+'<td>'+subObjects[0].bytes+'</td>'+'<td>'+subObjects[0].timeRange+'</td></tr>'); for(var j=1;j<len;j++){ table.append('<tr><td>'+subObjects[j].subtype+'</td>'+'<td>'+subObjects[j].fileCount+'</td>'+'<td>'+subObjects[j].bytes+'</td>'+'<td>'+subObjects[j].timeRange+'</td></tr>'); } } //为鼠标移动添加样式,鼠标所在行变色,鼠标离开行恢复原状 $("tr:even").addClass("even"); $("th").first().css("text-align","left"); $("th").first().css("padding-left","5px"); $("tr").mouseenter(function(){ $(this).addClass('bs'); }); $("tr").mouseleave(function(){ $(this).removeClass('bs'); }); } }); }
4.jsp
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="tab" id="table">
<tr>
<th></th>
<th>类别</th>
<th>文件大小</th>
<th>文件个数</th>
<th>时间范围</th>
</tr>
</table>