Spring 框架下Controller 返回结果在EasyUI显示

这几天弄了一下java下的在后台返回数据到jsp页面上的显示：

总结一下：

首先后台方面：

@RequestMapping(value="/searchByUserName")
    @ResponseBody
     public String searchByUserName(HttpServletRequest request,HttpServletResponse reponse ){
        String userName = request.getParameter("userName");
        /*JSONArray json = new JSONArray(adminService.findByUsername(userName));
        //Map<String, Object> result=new HashMap<String, Object>();
        return json.toString();*/
        List<Admin> admin = adminService.findByUsername(userName);
        List<HashMap<String,Object>> list = new ArrayList<HashMap<String,Object>>();
        int i;
        for (i=0; i < admin.size(); i++){
        Map<String,Object> result=new HashMap<String,Object>();
            if (admin != null){
                System.out.println(admin.get(i).getUserName());
                result.put("userName", admin.get(i).getUserName());
                result.put("roleName", admin.get(i).getRoleName());;
                result.put("telphone", admin.get(i).getTelphone());
                result.put("email", admin.get(i).getEmail());
                if (admin.get(i).getSex() == 1){
                    result.put("sex","男" );
                } else {
                    result.put("sex","女" );
                }
                result.put("createtime", admin.get(i).getCreateTime().toGMTString());
                list.add((HashMap<String, Object>) result);
            }
        }
        JSONArray  jsonArrayt= JSONArray.fromObject(list);
        System.out.println(jsonArrayt.toString());
        return jsonArrayt.toString();
    }

后台返回的数据类型是Json格式的，Json是什么呢？没仔细研究，个人理解大概就是一个String ，有着固定的格式和一些属性吧

接下来看jsp这边：

用jquery向后台发出请求，网上面很多都是php的，java也类似，刚开始弄有点麻烦

  1 function doSearch(){　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 //处理的是返回JSONArray
  2     userName = $("#itemid").val();　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　//获取搜索框中的内容
  3     var urlRequest="http://localhost:8080/account/searchByUserName?userName="+userName;　　　//请求路径，可以写成相对的吧
  4     $.getJSON(urlRequest, null, function(json) {　　　　　　　　　　　　　　　　　　　　　　　　　　//json是返回的结果，即java后台返回的String，这里是Object对象
  5                 /* $(function(){ 　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　//处理单个的
  6                     ccb={total:json.length,rows:[json[0]]};
  7                      $("#tt").datagrid('loadData', ccb); 
  8                     alert('here');
  9                     });  */
  10                    $("#tt").datagrid('loadData', {   　　　　　　　　　　　　　　　　　　　　　　　//加载数据到表格
 11                         "total": json.length,
 12                         "rows": json
 13                     }); 
 14             });
 15     }

<table id="tt" class="easyui-datagrid" style="width:1100px;height:500px"
            title="Searching" iconCls="icon-search" toolbar="#tb"
            rownumbers="true" pagination="true">
        <thead>
            <tr>
                <th field="userName" width="100">用户名</th>　　　　　　　　　　　　　　　　//这里的field和java后台的Json格式数据对应即可显示
                <th field="roleName" width="100">角色名</th>
                <th field="telphone" width=100" >电话</th>
                <th field="email" width="100" >邮件</th>
                <th field="sex" width="50">性别</th>
                <th field="createtime" width="160" align="center">账户创建时间</th>
            </tr>
        </thead>
    </table>
    <div id="tb" style="padding:3px">
        <span>用户名:</span>
        <input id="itemid" style="line-height:26px;border:1px solid #ccc">
        <span>角色名:</span>
        <input id="productid" style="line-height:26px;border:1px solid #ccc">
        <a href="#" class="easyui-linkbutton" plain="true" onclick="doSearch()">查询</a>
    </div>

 

 

这样就可以在easyUi上面显示数据了。