AJAX是一種用于更新網頁內容的技術，能夠在不刷新整個頁面的情況下，向服務器發送請求并接收響應。而JSP（JavaServer Pages）是一種用于開發動態網頁的Java技術。在JSP中，我們經常需要通過AJAX來獲取或更新表格數據。本文將通過舉例，介紹如何使用AJAX和JSP來處理表格數據。
假設我們有一個簡單的表格，包含員工的姓名、年齡和工資信息。我們希望實現一個功能，當用戶在輸入框中輸入員工的姓名后，AJAX會向服務器發送請求，服務器根據姓名查詢數據庫并返回匹配的結果。然后，我們使用JSP來動態地將查詢結果更新至表格中。
首先，我們來編寫HTML頁面。在頁面中，我們需要一個輸入框和一個表格，用于展示員工信息。以下是HTML代碼：
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#searchBtn").click(function() {
var name = $("#nameInput").val();
$.ajax({
type: "GET",
url: "search.jsp",
data: {name: name},
success: function(data) {
$("#resultTable").html(data);
}
});
});
});
</script>
</head>
<body>
<input type="text" id="nameInput"/>
<input type="button" id="searchBtn" value="Search"/>
<table id="resultTable">
<tr>
<th>姓名</th>
<th>年齡</th>
<th>工資</th>
</tr>
</table>
</body>
</html>在上述代碼中，我們使用JQuery庫來簡化AJAX請求的處理。當用戶點擊搜索按鈕時，會觸發點擊事件。事件處理函數首先獲取輸入框中的姓名，并使用AJAX發送GET請求到search.jsp頁面。請求中包含名為"name"的參數，其值為輸入框中的姓名。當請求成功后，AJAX會將服務器返回的查詢結果數據更新至id為"resultTable"的表格中。
接下來，我們來編寫JSP頁面。在JSP中，我們需要處理AJAX請求，連接數據庫并返回查詢結果。以下是search.jsp頁面的代碼：
<%@page import="java.sql.*"%>
<%@page import="javax.naming.*"%>
<%@page import="javax.sql.*"%>
<%
String name = request.getParameter("name");
String result = "";
try {
Context ctx = new InitialContext();
DataSource ds = (DataSource) ctx.lookup("java:comp/env/jdbc/mydb");
Connection conn = ds.getConnection();
Statement stmt = conn.createStatement();
String query = "SELECT * FROM employees WHERE name LIKE '%" + name + "%'";
ResultSet rs = stmt.executeQuery(query);
while (rs.next()) {
String employeeName = rs.getString("name");
int age = rs.getInt("age");
double salary = rs.getDouble("salary");
result += "<tr><td>" + employeeName + "</td><td>" + age + "</td><td>" + salary + "</td></tr>";
}
rs.close();
stmt.close();
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
out.print(result);
%>在上述代碼中，我們首先獲取從HTML頁面傳遞過來的"name"參數的值。然后，我們通過JNDI（Java Naming and Directory Interface）的方式獲取數據庫連接。使用SQL查詢語句，我們根據姓名模糊匹配查詢數據庫中的員工信息。查詢結果通過循環遍歷，將每條記錄的姓名、年齡和工資拼接至result字符串中。最后，將result字符串輸出至頁面。
通過上述的HTML和JSP代碼，我們實現了一個簡單的表格數據的查詢功能。用戶在輸入框中輸入員工的姓名，并點擊搜索按鈕后，表格會被更新為匹配的查詢結果。這只是AJAX和JSP處理表格數據的一個簡單示例，通過深入學習和靈活運用這兩種技術，我們可以實現更多復雜的功能。