Ajax 非同步或取後臺資料json顯示到頁面
今天心情很好,終於寫出來了用Ajax非同步獲取資料,不重新整理頁面。
後臺方法:
@RequestMapping("/uspaces.html" )
public void getUserSpace(HttpServletRequest request,HttpServletResponse response,String userName) throws IOException{
// String rtn="";
// PrintWriter out = response.getWriter();
// out.print(rtn);
// out.flush();
// out.close();
System.out.println(userName);
List<ViewSpace> viewSpaces = viewSpaceService.getAllSpaces();
String rtn=JsonUtil.list2json(viewSpaces);
System.out.println(rtn);
response.setCharacterEncoding("UTF-8");
// response.getWriter().write("{\"success\":true, \"data\":" + JsonUtil.list2json(viewSpaces) + "}");
// String rtn = "{\"success\":true, \"data\":" + JsonUtil.list2json(viewSpaces) + "}";
// response.getWriter().print(rtn);
response.getWriter().write(rtn);
response.getWriter().flush();
response.getWriter().close();
}
前臺Ajax:
$("#sub").click(function(){
var userName=$("#userName").val();
alert(userName);
$.post(
"<%= basePath %>manageSpaces/uspaces.html",
{userName:userName //提交引數
},
function(rtn){
alert(rtn);//
// eval("data="+rtn);
// var data=eval(rtn);
// var data=rtn.prototype.evalJSON = function(){
// return eval('(' + this + ')');
// };
var json = (new Function('return '+rtn +';'))(); //Json字串變成Json物件
alert(json);
var text='';
$(json).each(function(){
text+='<a>'+this.spaceName+'</a>   <a>'+this.address+'</a><br>';
});
alert(text);
$("#spacelist").html(text);
}
);
});
在後臺拼接出來的字串10個物件:[{"欄位名":"值","欄位名":"值","欄位名":"值"........},{"欄位名":"值","欄位名":"值","欄位名":"值"........},{"欄位名":"值","欄位名":"值","欄位名":"值"........},..........]
[{"address":"黑龍江","beenNum":"1","briefDesc":"","description":"","nowantNum":"1","spaceId":"1","spaceName":"哈爾濱","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"1","userName":"yezi"},"wantNum":"1","website":""},{"address":"黑龍江","beenNum":"1","briefDesc":"","description":"","nowantNum":"1","spaceId":"2","spaceName":"伊春","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"3","userName":"jiajia"},"wantNum":"1","website":""},{"address":"遼寧省","beenNum":"3","briefDesc":"","description":"","nowantNum":"5","spaceId":"3","spaceName":"瀋陽","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"1","userName":"yezi"},"wantNum":"2","website":""},{"address":"北京市","beenNum":"4","briefDesc":"","description":"","nowantNum":"5","spaceId":"4","spaceName":"北京","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"2","userName":"quanquan"},"wantNum":"3","website":""},{"address":"中國","beenNum":"7","briefDesc":"","description":"","nowantNum":"8","spaceId":"5","spaceName":"張家界","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"5","userName":"caicai"},"wantNum":"6","website":""},{"address":"中國","beenNum":"1","briefDesc":"","description":"","nowantNum":"2","spaceId":"6","spaceName":"景德鎮","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"2","userName":"quanquan"},"wantNum":"3","website":""},{"address":"遼寧","beenNum":"1","briefDesc":"","description":"","nowantNum":"0","spaceId":"7","spaceName":"大連","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"4","userName":"feifei"},"wantNum":"3","website":""},{"address":"吉林","beenNum":"2","briefDesc":"","description":"","nowantNum":"0","spaceId":"8","spaceName":"長春","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"4","userName":"feifei"},"wantNum":"1","website":""},{"address":"雲南","beenNum":"1","briefDesc":"","description":"","nowantNum":"0","spaceId":"9","spaceName":"大理","user":{"lastLoginIp":"","lastLoginTime":"","password":"admin","userId":"6","userName":"admin"},"wantNum":"1","website":""},{"address":"中國","beenNum":"2","briefDesc":"","description":"","nowantNum":"1","spaceId":"10","spaceName":"上海","user":{"lastLoginIp":"","lastLoginTime":"","password":"admin","userId":"6","userName":"admin"},"wantNum":"1","website":""}]