环境准备

  1.dataTables

    下载:http://download.csdn.net/detail/marskuroky/8173839

  2.jsonObject

    下载:http://download.csdn.net/detail/marskuroky/8173831

前台代码

  只是简单测试,把bean放在了session中,方便提取

<jsp:useBean id="userInfo" class="XXX.UserInfoSessionBean" scope="session"></jsp:useBean>

  dataTables代码展开,放到相应的路径(我的/WEB-INF/JS/)

  jsp代码

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@page import="XXX.Const"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<jsp:useBean id="userInfo" class="XXX.UserInfoSessionBean" scope="session"></jsp:useBean>
<%
String basePath = request.getContextPath() + "/";
%>
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
<link href="<%=basePath%>js/DataTables/media/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css" media="screen" />
<link href="<%=basePath%>js/DataTables/media/css/jquery.dataTables.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript" src="<%=basePath%>js/DataTables/media/js/jquery.js"></script>
<script type="text/javascript" src="<%=basePath%>js/DataTables/media/js/jquery.dataTables.js"></script> <style type="text/css">
.borRed{
color:red;
}
</style>
<script type="text/javascript" language="javascript"> var tmail = <%=userInfo.getMailAddr()%>
alert(tmail[].adOwnId);
$(document).ready(function() {
//$('#demo').html( '<table cellpadding="0" cellspacing="0" border="0" class="display" id="example"></table>' );
alert();
$("#example").dataTable({
"aaData": tmail,
"aoColumns": [
{ "mDataProp": "selectedRateUsd" },
{ "mDataProp": "selectedRateJpy" },
{ "mDataProp": "adOwnId" },
{ "mDataProp": "connDbId" },
]
} );
});
</script>
<title>Insert title here</title>
</head>
<body>
<div id="contents">
<table id="example">
<thead>
<tr>
<th>test1</th>
<th>test2</th>
<th>test3</th>
<th>test4</th>
</tr>
</thead>
<tbody> </tbody>
</table>
</div>
</body>
</html>

  后台代码

List<UserInfoSessionBean> list = new ArrayList<UserInfoSessionBean>();
UserInfoSessionBean bean1 = new UserInfoSessionBean();
bean1.setAdOwnId();
bean1.setConnDbId("");
list.add(bean1);
UserInfoSessionBean bean2 = new UserInfoSessionBean();
bean2.setAdOwnId();
bean2.setConnDbId("");
list.add(bean2);
JSONArray json = JSONArray.fromObject(list);
// userInfo是准备存在session中的bean
userInfo.setMailAddr(json.toString());

  

05-07 15:45