Spring mvc有一个注解@ResponseBody可以自己将返回数据解析成json，不用在response.getWriter(),设置response的编码之类的。
1、首先在spring-mvc.xml中配置如下
<bean id="mappingJacksonHttpMessageConverter" class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter"> <property name="supportedMediaTypes"> <list> <value>application/json;charset=UTF-8</value> </list> </property> </bean> <bean class="org.springframework.web.servlet.mvc.annotation.DefaultAnnotationHandlerMapping" /> <bean class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter"> <property name="messageConverters"> <list> <bean id="utf8StringHttpMessageConverter" class="com.liyi.test.common.UTF8StringHttpMessageConverter" /> <ref bean="mappingJacksonHttpMessageConverter" /> </list> </property> </bean>
别忘了，在下面还有一个UTF8StringHttpMessageConcerter类需要引入
package com.liyi.test.common;
import java.io.IOException;
import java.io.OutputStreamWriter;
import java.nio.charset.Charset;
import java.util.Arrays;
import java.util.List;
import org.springframework.http.HttpOutputMessage;
import org.springframework.http.MediaType;
import org.springframework.http.converter.StringHttpMessageConverter;
import org.springframework.util.FileCopyUtils;
public class UTF8StringHttpMessageConverter extends StringHttpMessageConverter {
private static final MediaType utf8 = new MediaType("text", "plain", Charset.forName("UTF-8"));
private boolean writeAcceptCharset = true;
@Override
protected MediaType getDefaultContentType(String dumy) {
return utf8;
}
protected List<Charset> getAcceptedCharsets() {
return Arrays.asList(utf8.getCharSet());
}
protected void writeInternal(String s, HttpOutputMessage outputMessage) throws IOException {
if (this.writeAcceptCharset) {
outputMessage.getHeaders().setAcceptCharset(getAcceptedCharsets());
}
Charset charset = utf8.getCharSet();
FileCopyUtils.copy(s, new OutputStreamWriter(outputMessage.getBody(), charset));
}
public boolean isWriteAcceptCharset() {
return writeAcceptCharset;
}
public void setWriteAcceptCharset(boolean writeAcceptCharset) {
this.writeAcceptCharset = writeAcceptCharset;
}
}
2、配置好了，就可以写展示列表的后台代码了，以下，有两个方法，一个是做页面跳转用的，一个是用于ajax请求数据的。
@RequestMapping("/toUserList")
public String redirctUserList(){
return "user/new_user_list";
}
@ResponseBody
@RequestMapping("/userList")
public String userList(@RequestParam Map<String,Object> conds){
//默认每页10条
int pageSize = 10;
//默认第一页 计算开始条数
int currentPage = 1;
//获取页面传来每页显示条数
String row = (String) conds.get("rows");
//获取页面传来当前页码
String page = (String) conds.get("page");
if(null!=row&&!"".equals(row)){
pageSize=Integer.valueOf(row);
}
if(null!=page&&!"".equals(page)){
currentPage= Integer.valueOf(page);
}
Map<String,Object> map = new HashMap<String,Object>();
//计算一共有多少条
int count = userService.getTotalPage();
map.put("pageCount",pageSize);
//计算从第几条开始
map.put("currentPage",new PageUtil().getCurrent(currentPage,pageSize));
List<UserPO> list = userService.findAll(map);
Map<String,Object> map1 = new HashMap<String,Object>();
map1.put("total", count);
map1.put("rows",list);
String json = JSON.toJSONString(map1, true);
System.out.println(json);
return json;
}
只需要把你需要返回的数据，用fastjson将对象转成json串传入到页面，页面直接就可以取到。其中要注意，easyui展示列表的json如下：
[
{
"total": 13,
"rows": [
{
"createTime": 1438678875000,
"id": 1,
"mobile": "123456",
"name": "liyi",
"pwd": "123456"
},
{
"createTime": 1438679219000,
"id": 2,
"mobile": "123456",
"name": "scc",
"pwd": "123456"
},
{
"createTime": 1438679264000,
"id": 3,
"mobile": "123456",
"name": "diudiu",
"pwd": "123456"
},
{
"createTime": 1438679338000,
"id": 4,
"mobile": "123456",
"name": "xiaopaigu",
"pwd": "123456"
},
{
"createTime": 1438680558000,
"id": 5,
"mobile": "123456",
"name": "iphone",
"pwd": "123456"
},
{
"createTime": 1438682344000,
"id": 6,
"mobile": "123456",
"name": "iphone1",
"pwd": "123456"
},
{
"createTime": 1438754235000,
"id": 7,
"mobile": "123456",
"name": "abc",
"pwd": "123456"
},
{
"createTime": 1438852983000,
"id": 8,
"mobile": "11",
"name": "11",
"pwd": "11"
},
{
"createTime": 1438914359000,
"id": 9,
"mobile": "123456",
"name": "123456",
"pwd": "456789"
},
{
"createTime": 1439530418000,
"id": 10,
"mobile": "123",
"name": "123",
"pwd": "123"
}
]
}
]
3、jsp页面首先引入easyui的js 以及css
<link rel="stylesheet" type="text/css" href="static/jquery-easyui-1.3.2/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="static/jquery-easyui-1.3.2/themes/icon.css">
<script type="text/javascript" src="static/js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="static/jquery-easyui-1.3.2/jquery.easyui.min.js"></script>
<script type="text/javascript">
$(function(){
$(‘#dg‘).datagrid({
url:‘${app}/userController/userList.do‘,
columns:[[
{field:‘name‘,title:‘姓名‘,width:100 },
{field:‘mobile‘,title:‘手机号‘,width:100},
{field:‘_operate‘,width:80,align:‘center‘,formatter:function(value,rec){
return "<a href=‘‘ >编辑</a>";
},title:‘操作‘}
]],
toolbar: [{
iconCls: ‘icon-add‘,
handler: function(){alert(‘编辑按钮‘)}
},‘-‘,{
iconCls: ‘icon-help‘,
handler: function(){alert(‘帮助按钮‘)}
}],
fitColumns:true,
striped:true,
pagination:true,
rownumbers:true,
pageNumber:1,
pageSize:10,
pageList:[10,20,30,40,50]
});
})
</script>
<table id="dg"></table>
4、分页你可以用firefox观察一下，他会传入到后台两个参数，一个是当前页page，一个是rows每页的数量，根据我上篇文章的分页工具即可。在找到上面的List展示方法就可以了。
时间： 2024-10-12 02:11:21