前端dataTable表格获取数据库中的数据,完整代码(仅提供html,servlet代码)
时间: 2024-02-17 12:02:24 浏览: 260
将DataTable数据源导出到Html文件
5星 · 资源好评率100%
好的,以下是一个简单的前端dataTable表格获取数据库中数据的示例代码,包含HTML和Servlet代码:
HTML代码:
```
<!DOCTYPE html>
<html>
<head>
<title>DataTable表格获取数据库中的数据示例</title>
<!-- 引入jQuery库和DataTables插件 -->
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.18/datatables.min.css"/>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.18/datatables.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
// 使用DataTables插件初始化表格,并从Servlet中获取数据
$('#myTable').DataTable({
"ajax": "/getData",
"columns": [
{"data": "id"},
{"data": "name"},
{"data": "age"},
{"data": "email"}
]
});
});
</script>
</head>
<body>
<table id="myTable" class="display">
<thead>
<tr>
<th>ID</th>
<th>姓名</th>
<th>年龄</th>
<th>邮箱</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</body>
</html>
```
Servlet代码:
```
import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.Statement;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.google.gson.JsonObject;
import com.google.gson.JsonArray;
public class GetDataServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setContentType("application/json; charset=utf-8");
PrintWriter out = response.getWriter();
Connection conn = null;
Statement stmt = null;
ResultSet rs = null;
JsonArray jsonArray = new JsonArray();
try {
// JDBC连接数据库
Class.forName("com.mysql.jdbc.Driver");
String url = "jdbc:mysql://localhost:3306/mydb?useSSL=false";
String username = "root";
String password = "root";
conn = DriverManager.getConnection(url, username, password);
stmt = conn.createStatement();
// 查询数据
String sql = "SELECT * FROM user";
rs = stmt.executeQuery(sql);
// 处理结果集,转换为Json格式
while (rs.next()) {
JsonObject jsonObject = new JsonObject();
jsonObject.addProperty("id", rs.getInt("id"));
jsonObject.addProperty("name", rs.getString("name"));
jsonObject.addProperty("age", rs.getInt("age"));
jsonObject.addProperty("email", rs.getString("email"));
jsonArray.add(jsonObject);
}
out.print(jsonArray);
} catch (Exception e) {
e.printStackTrace();
} finally {
// 关闭资源
try {
if (rs != null) rs.close();
if (stmt != null) stmt.close();
if (conn != null) conn.close();
} catch (Exception e) {
e.printStackTrace();
}
out.flush();
out.close();
}
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
```
注意事项:
1. HTML文件中需要引入jQuery库和DataTables插件的相关文件;
2. Servlet代码中需要引入Gson库来处理结果集;
3. 数据库连接的相关信息(如URL、用户名、密码等)需要根据实际情况修改;
4. 需要将Servlet代码部署到Web服务器中,并将HTML文件放置到Web服务器的根目录或其子目录下。
阅读全文