我创建了一个简单的站点,它读取数据库表并将其显示在浏览器的 html 表中。我有一个按钮,允许更改、保存表格,然后使用更新的表格自动转发到主页。我还有一个选择按钮,用户可以使用该按钮选择该特定行并更新表中的一列。
我的问题是我需要一种方法来显示已选择的行。我更喜欢在 HTML 表中有一列显示一张图片,说明选择了哪一张。
这是我的主页,其中显示了数据库表。如果选择了该行,我想在 html 的左列中添加图像。
我已经尝试了几件事,比如使用 javascript,但就是无法理解它?我能得到一些帮助吗?
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@page import="java.io.*, java.util.*, java.sql.*"%>
<%@page import="oracle.jdbc.driver.OracleConnection" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script language="javascript">
function editRecord(id) {
var f=document.form;
f.method="post";
f.action='edit.jsp?id='+id;
f.submit();
}
function selectRecord(id, btn, i) {
var f=document.form;
f.method="post";
f.action='select.jsp?id='+id;
f.submit();
if(!btn.style) {
alert("not supported");
return;
} else{
btn.style.background = "red";
return;
}
}
</script>
</head>
<body>
<br><br>
<form method="post" name="form">
<table id="data" border="1">
<tr>
<th>Selected</th>
<th>Name</th>
<th>Address</th>
<th>Contact No</th>
<th>Email</th>
<th>Select</th>
</tr>
<%
int sumcount=0;
ResultSet rs = null;
Connection con = null;
Statement st = null;
try {
DriverManager.registerDriver (new oracle.jdbc.OracleDriver());
con = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:XE", "username", "password");
st = con.createStatement();
rs = st.executeQuery("SELECT * FROM employee");
%>
<%
while(rs.next()) {
%>
<tr>
<td></td>
<td><%=rs.getString(2)%></td>
<td><%=rs.getString(3)%></td>
<td><%=rs.getString(4)%></td>
<td><%=rs.getString(5)%></td>
<td><input type="button" name="edit" value="Edit" style="background-color:#49743D;font-weight:bold;color:#ffffff;" onclick="editRecord(<%=rs.getString(1)%>);" /></td>
<td><input type="button" name="select" value="Select" style="background-color:#49743D;font-weight:bold;color:#ffffff;" onclick="selectRecord(<%=rs.getString(1)%>, this);" /></td>
</tr>
<%
}
%>
<%
}
catch(Exception e){
e.printStackTrace();
}
%>
</table>
</form>
</body>
</html>