javaweb-list页面显示在弹出框内

最新推荐文章于 2021-10-12 17:14:19 发布

zhangxiaomin19921

最新推荐文章于 2021-10-12 17:14:19 发布

阅读量2.1k

点赞数

分类专栏： javaweb

本文链接：https://blog.csdn.net/zhangxiaomin1992/article/details/62425531

版权

javaweb 专栏收录该内容

45 篇文章 0 订阅

订阅专栏

  如图所示： 

  这个任务的限制在于： 

  弹出框的jsp和首页面的jsp是同一个页面 

  后台需要返回数据，不能是model 

  因此后台采用了返回json字符串，前台解析json字符串为json数据，获取json对象中的id即可。 

  json字符串 

{
    "queryList": [
        {
            "adjust_amount": "50.0000",
            "adjust_date": "2017-01-16",
            "adjust_reason": "订单异常",
            "adjust_type": "1",
            "apply_name": "操作员A",
            "id": "1"
        },
        {
            "adjust_amount": "80.0000",
            "adjust_date": "2017-01-16",
            "adjust_reason": "未知异常",
            "adjust_type": "1",
            "apply_name": "小明",
            "id": "2"
        }
    ]
}

后台：

@ResponseBody
	@RequestMapping("/toAccountSnapshortRecoedView")
	public String toAccountSnapshortRecoedView(@RequestParam("ppUserNo") String ppUserNo,
			@RequestParam("ppTime") String ppTime){
		JSONObject object = new JSONObject();
		Map<String, Object> map = new HashMap<String, Object>();
        map.put("ppUserNo",ppUserNo);
        map.put("ppTime",ppTime);
		List queryList = new ArrayList();
        queryList = QueryServiceUtil.query("settleclearQueryService", "queryTransferRecord", map);
        object.put("queryList", queryList);
	    return object.toString();
	}

  jsp: 

function show(ppUserNo,ppTime) {
    		   var path = "${pageContext.request.contextPath}";
               $.post(path + "/boss/accounting/accountSnapshot/toAccountSnapshortRecoedView", {
                   "ppUserNo": ppUserNo,
                   "ppTime":ppTime
               }, function (reInfo) {
            	   $("#table").empty();//清空否则每次都会append
            	   //标题再次附加
            	   $("#table").append("<tr><td>调账ID</td><td>操作员</td><td>操作日期</td><td>调整金额</td><td>错误类型</td><td>备注</td></tr>");
            	   var data=eval("(" + reInfo + ")");//转化为json对象
            	   $.each(data, function(idx, obj) {//针对list套取list需要结合each和for
            		   for ( var a = 0; a < obj.length; a++) {
          	        	$("#table").append(
                               "<tr><td>"+obj[a].id+"</td>"+
                               "<td>"+obj[a].apply_name+"</td>"+
                               "<td>"+obj[a].adjust_date+"</td>"+
                               "<td>"+obj[a].adjust_amount+"</td>"+
                               "<td>"+obj[a].adjust_reason+"</td>"+
                               "<td>"+obj[a].id+"</td>"+
                               "</tr>");
            		   }
          	       }); 
               });
       }