• servlet 之 返回json数据并显示


    //实体类
    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>
  • 相关阅读:
    MySQL主从复制(7)回顾原理、企业场景部署
    MySQL主从复制(6)故障、快速配置
    *MySQL主从复制(5)实战
    MySQL主从复制(4)原理画图深入浅出
    MySQL主从复制(3)应用场景,切换不丢数据
    MySQL主从复制(2)介绍及分布式架构
    MySQL主从复制(1)DB各种同步方案
    找到小镇的法官
    最长回文子串
    权限管理
  • 原文地址:https://www.cnblogs.com/jokerjason/p/5733292.html
Copyright © 2020-2023  润新知