Ajax接收并显示后台传来的list集合内的数据信息
最近在学习Ajax做一个留言系统的时候碰到需要将list集合从后台传到前台ajax接收并显示的情况,在网上搜了很多,但很多情况都不是和我遇见的情况一样的,现在,直接贴出我的问题及解决方法。
后台代码:
@RequestMapping(value="/findReply")
@ResponseBody
public Map<String, Object> findReply(int mid){
System.out.println("mid:"+mid);
List<Reply> replies=replyService.findReply(mid);
Map<String, Object> map = new HashMap<String, Object>();
map.put("replies", replies);
return map;
}
后台是springMVC,将查询的集合replies放进map,返回到前台。
前台ajax接收代码如下:
var mid;
function LookReply(mid){
$.ajax({
dataType:"json",
type:"POST",
url:"../reply/findReply.action",
data:{mid:mid},
success:function(data){
var arr=data.replies;//如果前方代码取值不称就用这个:jQuery.parseJSON(data).replies;
for(var i=0;i<data.replies.length;i++){
var name=arr[i].replier;
var content=arr[i].reply;
var time=arr[i].time;
$('#reply_'+mid).prepend("<dl style='background-color:pink;'><dt>"+content+"</dt><dd>回复者:"+name+"</dd><dd>回复时间:"+time+"</dd></dl>");
}
},error:function(data){
alert(系统错误);
}
});
}
注意:
var arr=data.replies;
这部分代码是,后台传出的是map,并不是直接的list集合replies,list集合replies是放进map集合内传出的,所以data接收的是map,需要显示的是list集合replies内的信息,所以在前台新new一个对象接收map内的replies集合,来代替replies。
信息的获取注意for循环内的代码,当然也可以使用each进行循环遍历。
$('#reply_'+mid)
这个地方是和下边的html代码结合使用的,下边的html代码是循环输出,所以使用信息的id动态为div赋予id名。
html代码如下:
<c:forEach items="${messages }" var="message">
<div>
<div>
<p><font color="red">${message.content }</font></p>
</div>
<div><button onclick="LookReply(${message.mid })">查看回复</button></div>
<div id="reply_${message.mid }"></div>
</div>
<br>
</c:forEach>
Ajax接收并显示后台传来的list集合内的数据信息的更多相关文章
- ajax post方式下载后台传来的文件
参考:http://stackoverflow.com/questions/16086162/handle-file-download-from-ajax-post $.ajax({ type: &q ...
- javaScript(拼写树形)+ajax请求,去后台查找数据
第一步:页面加载完成时,利用jquery中的一函数,调用js方法,js方法,发送ajax请求,去后台查找父类权限集合,响应回来json格式的数据,对数据进行操作,往页面上添加内容 //页面初始化加载菜 ...
- Highcharts接收后台传来的json对象值无法显示
在highcharts接收后台传来的json对象网上已经有很多的介绍,在此不多做说明,这里想记录一笔的是在接收的json解析后的value值是String类型的,而highcharts里的data数组 ...
- jQuery ajax方法success()中后台传来的四种数据类型
1.后台返回一个页面 js代码 /**(1)用$("#content-wrapper").html(data);显示页面*/ $.ajax({ async : false, cac ...
- jQuery AJAX 方法 success()后台传来的4种数据
JAVA中的四种JSON解析方式详解 jQuery AJAX 方法 success()后台传来的4种数据 1.后台返回一个页面 js代码 /**(1)用$("#content-wrapper ...
- 【.net ajax显示后台返回值】
1..net ajax显示后台返回值 <script> $(document).ready(function () { $("#btn&quo ...
- EF5+MVC4系列(7) 后台SelectListItem传值给前台显示Select下拉框;后台Action接收浏览器传值的4种方式; 后台Action向前台View视图传递数据的四种方式(ViewDate,TempDate,ViewBag,Model (实际是ViewDate.Model传值))
一:后台使用SelectListItem 传值给前台显示Select下拉框 我们先来看数据库的订单表,里面有3条订单,他们的用户id对应了 UserInfo用户表的数据,现在我们要做的是添加一个Ord ...
- jsp实时显示后台批处理进度 - out分块,简单的长连接方式
这两天在实现一个批处理操作,但是想让前台实时显示后台批处理进度,本想着用复杂一些的框架可以实现异步信息调用 但是鉴于是内部管理系统,且只有一两个人用到这个功能,所以做了一个简单的长连接方式的实时响应 ...
- Asp.Net MVC页面显示后台处理进度问题
这个问题的背景是,用户通过浏览器上传文件或Excel数据到系统中,页面需要时时显示后台处理进度,以增强用户的体验. 在GitHub上找到一个一个项目,基本实现了这个功能,具体效果如下图 代码实现过程大 ...
随机推荐
- 微信小程序尝鲜一个月现状分析
概述 曾记得在微信小程序还没有上线的时候,大家都是翘首以待.希望在张小龙,在企鹅的带领下,走出差别于原生开发的还有一条移动开发的道路,我也是一直关注着.知道1月9号,微信小程序最终对外开放了,作为第一 ...
- python解析命令行参数
常常需要解析命令行参数,经常忘记,好烦,总结下来吧. 1.Python 中也可以所用 sys 的 sys.argv 来获取命令行参数: sys.argv 是命令行参数列表 参数个数:len(sys.a ...
- VB 中 copymemory的有关问题
dim a() as long dim b() as bytecopymemory b(0),byval "1234",4 copymemory byval varptr(a(0) ...
- RN组件备忘录
1:ActivityIndicator:圆形的loading提示符号. 2:Button:按钮 3:FlatList:高性能列表组件,支持下拉刷新. 4:Image:图片组件,能显示 网络图片.静态资 ...
- 【物联网智能网关-17】.NET Micro Framework之MDK C++二次开发
.NET Micro Framework虽然好学易用,但是在一些需要实时,需要高性能的应用领域,却有些勉为其难.毕竟.NET Micro Framework上层应用程序由底层CLR(TinyCLR)解 ...
- Docker Swarm Mode无法增加管理节点
这两天用Docker Swarm Mode,加入新的管理节点会报以下错误(在/var/log/messages文件中可以看到): Handler for POST /v1.37/swarm/join ...
- 转:OGRE 渲染通路(Pass)
一个渲染通路就是几何问题里的一次渲染:一个带有一整套渲染属性的渲染API的一次调用.一个技术可以包含有1到16个渲染通路,当然,渲染通路用得越多,技术在渲染的时候开销越大. 为了清楚识别使用的到底是哪 ...
- Spring-security-Oauth2.0
上周,我想开发OAuth 2.0的一个实例.我检查了Spring-security-Oauth2.0的样例,OAuth 2提供商sparklr2和OAuth 2客户端TONR .我探索在互联网上了一下 ...
- 利用Git进行团队协作
前言: 这里简单介绍一下Git的历史. 同生活中的许多伟大事件一样,Git 诞生于一个极富纷争大举创新的年代.Linux 内核开源项目有着为数众广的参与者.绝大多数的 Linux 内核维护工作都花在了 ...
- Oracle Tuxedo工作站客户端与服务端的样例程序
服务端代码: #include <stdio.h> #include <stdlib.h> #include <string.h> #include <cty ...