本菜鸟做的一个小demo模板,如图,点击create按钮 右边弹出div ,在本页面直接修改数据。
用 document.getElementById只能提取到第一条数据到修改的input中,想要点击哪一行的create,右边input内value就变成当前行数据。css代码就不贴了 。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>111</title>
</head>
<body>
<%
//加载驱动程序
Class.forName("com.mysql.jdbc.Driver").newInstance();
//数据库信息
String user="root";
//密码
String password="1234566";
//数据库名
String dbName="testdemo";
//表名
String tableName="student";
//将数据库信息字符串连接成为一个完整的url(也可以直接写成url,分开写是明了可维护性强)
String url="jdbc:mysql://localhost:3306/"+dbName+"?user="+user+"&password="+password; //配置并连接数据库
Connection conn = DriverManager.getConnection(url, user, password);
Statement stmt = conn.createStatement();
%>
<%--表单--%>
<table class="bordered">
<thead>
<tr>
<th>ID</th>
<th>NAME</th>
<th>CLASS</th>
<th>AGE</th>
<th><input onclick="add()" type="button" class="xinzeng" value="CREATE"></th>
</tr>
</thead> <%
String sql = "SELECT * FROM "+tableName;
ResultSet rs = stmt.executeQuery(sql);
%>
<% //想要这个循环体内的三个input的值传递到最后那个form里面的input中。
while(rs.next()) {
%>
<tr>
<td><%=rs.getString("id") %></td>
<td><%=rs.getString("name") %><input name="name" type="hidden" value="<%=rs.getString("name") %>"></td>
<td><%=rs.getString("class") %><input name="class" type="hidden" value="<%=rs.getString("class") %>"></td>
<td><%=rs.getString("age") %><input name="age" type="hidden" value="<%=rs.getString("age") %>"></td>
<td>
<%--<form action="update1.jsp" method="post">--%>
<input type="hidden" name="id" value="<%=rs.getString("id") %>">
<input onclick="update()" class="xiugai" type="button" value="UPDATE">
<%--</form>--%>
<form action="deleteaction.jsp" method="post">
<input type="hidden" name="id" value="<%=rs.getString("id") %>">
<input class="shanchu" type="submit" value="DELETE">
</form>
</td>
</tr> <%
}
%>
</table>
<div class="D1">
<div id="div1" class="dd">
<form action="insertaction.jsp" method="post">
<ul>
<li><p>CREATE A NEW STUDENT</p></li>
<li><div><span>NAME:</span><input type="text" name="name1"></div></li>
<li><div><span>CLASS:</span><input type="text" name="class1"></div></li>
<li><div><span>AGE:</span><input type="text" name="age1"></div></li>
<li><input type="submit" value="SUBMIT"></li>
</ul>
</form>
</div>
<div id="div2" class="dd">
<form action="" method="post">
<ul>
<li><p>UPDATE STUDENT INFO</p></li>
<li><div><span>NAME:</span><input id="updateName1" type="text" value=""></div></li>
<li><div><span>CLASS:</span><input id="updateClass1" type="text" value=""></div></li>
<li><div><span>AGE:</span><input id="updateAge1" type="text" ></div></li>
<li><input type="submit" value="SUBMIT"></li>
</ul>
</form>
</div>
</div>
<%
rs.close();
stmt.close();
conn.close();
%>
</body>
</html>
用 document.getElementById只能提取到第一条数据到修改的input中,想要点击哪一行的create,右边input内value就变成当前行数据。css代码就不贴了 。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>111</title>
</head>
<body>
<%
//加载驱动程序
Class.forName("com.mysql.jdbc.Driver").newInstance();
//数据库信息
String user="root";
//密码
String password="1234566";
//数据库名
String dbName="testdemo";
//表名
String tableName="student";
//将数据库信息字符串连接成为一个完整的url(也可以直接写成url,分开写是明了可维护性强)
String url="jdbc:mysql://localhost:3306/"+dbName+"?user="+user+"&password="+password; //配置并连接数据库
Connection conn = DriverManager.getConnection(url, user, password);
Statement stmt = conn.createStatement();
%>
<%--表单--%>
<table class="bordered">
<thead>
<tr>
<th>ID</th>
<th>NAME</th>
<th>CLASS</th>
<th>AGE</th>
<th><input onclick="add()" type="button" class="xinzeng" value="CREATE"></th>
</tr>
</thead> <%
String sql = "SELECT * FROM "+tableName;
ResultSet rs = stmt.executeQuery(sql);
%>
<% //想要这个循环体内的三个input的值传递到最后那个form里面的input中。
while(rs.next()) {
%>
<tr>
<td><%=rs.getString("id") %></td>
<td><%=rs.getString("name") %><input name="name" type="hidden" value="<%=rs.getString("name") %>"></td>
<td><%=rs.getString("class") %><input name="class" type="hidden" value="<%=rs.getString("class") %>"></td>
<td><%=rs.getString("age") %><input name="age" type="hidden" value="<%=rs.getString("age") %>"></td>
<td>
<%--<form action="update1.jsp" method="post">--%>
<input type="hidden" name="id" value="<%=rs.getString("id") %>">
<input onclick="update()" class="xiugai" type="button" value="UPDATE">
<%--</form>--%>
<form action="deleteaction.jsp" method="post">
<input type="hidden" name="id" value="<%=rs.getString("id") %>">
<input class="shanchu" type="submit" value="DELETE">
</form>
</td>
</tr> <%
}
%>
</table>
<div class="D1">
<div id="div1" class="dd">
<form action="insertaction.jsp" method="post">
<ul>
<li><p>CREATE A NEW STUDENT</p></li>
<li><div><span>NAME:</span><input type="text" name="name1"></div></li>
<li><div><span>CLASS:</span><input type="text" name="class1"></div></li>
<li><div><span>AGE:</span><input type="text" name="age1"></div></li>
<li><input type="submit" value="SUBMIT"></li>
</ul>
</form>
</div>
<div id="div2" class="dd">
<form action="" method="post">
<ul>
<li><p>UPDATE STUDENT INFO</p></li>
<li><div><span>NAME:</span><input id="updateName1" type="text" value=""></div></li>
<li><div><span>CLASS:</span><input id="updateClass1" type="text" value=""></div></li>
<li><div><span>AGE:</span><input id="updateAge1" type="text" ></div></li>
<li><input type="submit" value="SUBMIT"></li>
</ul>
</form>
</div>
</div>
<%
rs.close();
stmt.close();
conn.close();
%>
</body>
</html>
解决方案 »
免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货