servlet对象通过json返回到前台页面并展示

来源:互联网 发布:知乎员工数量 编辑:程序博客网 时间:2024/04/30 07:59

1、实体类

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>


原创粉丝点击