springmvc+easyui
最近断断续续在写ssm+easyui datagrid显示，中间遇到一些问题，因为对框架的原理这些不是很理解，所以即使百度了还是不能解决。后来看了些视频教程，直到现在才显示成功，现在想来不难，所以把过程在此记录一下
@Controller
public class UserController {
@Autowired
private UserService userService;
@RequestMapping("/queryUser")
public @ResponseBody Map<String,Object> queryUserList(HttpServletRequest request) throws Exception{
List<User> userlist=userService.findUserList();
Map<String,Object> map=new HashMap<String,Object>();
map.put("total", userlist.size());
map.put("rows", userlist);
System.out.println(userlist);
return map;
}
}@ResponseBody可直接将java对象转换成json格式
easyui和后台交互通过json数据
访问controller直接可以返回jason数据
接下来就是需要把此json数据显示到easyui界面
<script type="text/javascript" charset="utf-8">
var datagrid;
$(function(){
$('#datagrid').datagrid({
fit:true,
fitColumns : true,
rownumbers : true,
border : false,
striped : true,
url:'../queryUser.action',
toolbar : '#student_tool',
rownumbers:true,//显示行号
pagination:true,//显示分页工具条
pageList : [5, 10, 15,20],
pageNumber : 1,
pageSize : 5,
sortName : 'id',
sortOrder : 'ASC',
columns:[[
{
field:'id',
title:'编号',
checkbox:true,
width:100,
},{
field:'name',
title:'姓名',
sortable:true,
width:100,
},{
field:'age',
title:'年龄',
sortable:true,
width:100,
},{
field:'hobby',
title:'爱好',
width:100,
}]],
toolbar:[{
text:'增加' ,
iconCls:'icon-add',
handler:function(){
}
},{
text:'删除' ,
iconCls:'icon-remove',
handler:function(){
}
},{
text:'修改' ,
iconCls:'icon-edit',
handler:function(){
}
},{
text:'查询' ,
iconCls:'icon-search',
handler:function(){
}
}]
});
});
</script>
<div class="easyui-tabs" fit="true" border="false">
<div title="用户管理">
<table id="datagrid"></table>
</div>
</div>
开始写的是绝对路径${pagecontext.request.contextpath}/queryUser.action不对，Chrome检查有个错误，得到的是错误的路径
后来就改为../queryUser.action就正确了
还有这其中反反复复显示这个错误(jquery报错)
Cannot read property 'length' of undefined
后来把url替换成正确的json文件 跟自己的进行对比才发现我把rows写成了row
自己检查的时候可以把url写json文件直接显示数据，不需要通过后台数据显示
center.json{
"total":3,
"rows":[
{"id":1,"name":"张三ss","age":34,"hobby":"篮球"},
{"id":2,"name":"小白","age":23,"hobby":"足球"},
{"id":3,"name":"花花","age":67,"hobby":"电脑"}
]
}url:'center.json',现在可以正确显示了
版权声明：本文为Hajnal原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接和本声明。