To complete this function by using 3 .jsp files
Index.jsp: Show employee information, each word with a "modified" word, as a hyperlink to "edit.jsp".
Edit.jsp: The place to modify the data, there are two buttons "Update" and "Cancel".
Update_db.jsp: There is no screen, only the update action, after returning to "index.jsp".
共有三個檔案來完成此功能
index.jsp：秀出員工資料，每一筆資料後面帶一個"修改"字樣，做為超連結到"edit.jsp"。
edit.jsp：修改資料的地方，有"更新"以及"取消"二個按鈕。
update_db.jsp：沒有畫面，只做更新的動作，做完後回到 "index.jsp"。
Code：
index.jsp
<%@ page import="java.sql.*" contentType="text/html;charset=UTF-8" %>
<html>
<head>
<title>UPDATE Syntax Practice</title>
</head>
<body bgcolor="skyblue">
SQL UPDATE Syntax Practice
<a href='../'>BACK</a>
<hr>
<%
Class.forName("com.mysql.jdbc.Driver");
String url = "jdbc:mysql://localhost:3306/company?user=root&password=apple&charset=utf8";
Connection con = DriverManager.getConnection(url);
Statement stmt = con.createStatement();
//下SQL語法，將所有員工資料取出並依照 ID 由小到大排序
String strSQL = "SELECT * FROM employee order by 'ID'";
//將上述準備好的員工資料，放到 ResultSet 中(就是放到記憶體)。
ResultSet rs = stmt.executeQuery(strSQL);
String ID=null;
String c_name=null;
String e_name=null;
String d_name=null;
String position=null;
String pwd=null;
//開始畫表格
out.print("<table border='1'>");
//表格第一列的欄位名稱為資料的屬性
out.print("<tr align='center'><td><b>ID</b></td><td><b>中文名</b></td><td><b>英文名</b></td><td><b>部門別</b></td><td><b>職務</b></td><td><b>密碼</b></td><td></td></tr>");
while ( rs.next() ){
//從 ResultSet 中取出員工資料
ID = rs.getString("ID");
c_name = rs.getString("c_name");
e_name = rs.getString("e_name");
d_name = rs.getString("d_name");
position = rs.getString("position");
pwd = rs.getString("pwd");
//印出表格，內含員工資訊
out.print("<tr><td>" +ID + "</td><td>");
out.print(c_name + "</td><td>");
out.print(e_name + "</td><td>");
out.print(d_name + "</td><td>");
out.print(position + "</td><td>");
out.print(pwd + "</td><td>");
//將 ID 作為參數，嵌入到每一列最右方的超連結中。
out.print( "<a href='./edit.jsp?ID=" +ID +"'>修改</a></td></tr>");
}
out.println("</table>");
stmt.close();
con.close();
%>
</body>
</html>
Result：
edit.jsp
<%@ page import="java.sql.*" contentType="text/html;charset=UTF-8" %>
<html>
<head>
<title>修改</title>
</head>
<body bgcolor='skyblue'>
<!-- 用 form 來做一個 "更新" 的按鈕，導到 update_db.jsp。 -->
<form name='f1' method='post' action='update_db.jsp'>
<%
//銜接由 index.jsp 最後面傳出的參數 ID，放到字串 ID 裡
String ID = request.getParameter("ID");
//判斷 ID不可為null，且長度大於零。(老師的範例是用 e_name 當參數，所以要判斷)
// 我是用 ID 當參數，一定符合上述條件，所以可以不必判斷。
if (ID != null && ID.length() > 0) {
Class.forName("com.mysql.jdbc.Driver");
String url = "jdbc:mysql://localhost:3306/company?user=root&password=apple&charset=utf8";
Connection con = DriverManager.getConnection(url);
Statement stmt = con.createStatement();
//這裡只取出符合 ID 的員工資訊，也就是在 index.jsp 中，所選取的該列的 ID
String strSQL = "SELECT * FROM employee where ID = '" + ID +"'";
ResultSet rs = stmt.executeQuery(strSQL);
if (rs.next()){
//這裡先顯示 ID (不是在 textbox 裡面，所以不可變更)。
//再用隱藏 (type='hidden')的 <input> 帶出參數 ID 給 update_db.jsp 使用
out.print("帳號：" + ID + "<input type='hidden' name='ID' value='" +rs.getString("ID") +"'></br>");
out.print("中文名：<input type='text' name='c_name' value='" + rs.getString("c_name") + "'></br>");
out.print("英文名：<input type='text' name='e_name' value='" + rs.getString("e_name") + "'></br>");
out.print("部門別：<input type='text' name='d_name' value='" + rs.getString("d_name") + "'></br>");
//為了對齊 textbox，所以用一些空格
out.print("職務： <input type='text' name='position' value='" + rs.getString("position") + "'></br>");
out.print("密碼： <input type='text' name='pwd' value='" + rs.getString("pwd") + "'></br>");
//第一個 form 的按鈕，送出更新的訊息到 update_db.jsp。
out.print("<input type='submit' value='更新'>");
}
stmt.close();
con.close();
}
%>
</form>
//第二個 form 開始，只做取消用，導回 index.jsp。
<form name='f2' method='post' action='index.jsp'>
<input type='submit' value='取消'>
</form>
</body>
</html>
Result：
update_db.jsp
<%@ page import="java.sql.*" contentType="text/html;charset=UTF-8" %>
<%
String ID = request.getParameter("ID");
String c_name = request.getParameter("c_name");
String e_name = request.getParameter("e_name");
String d_name = request.getParameter("d_name");
String position = request.getParameter("position");
String pwd = request.getParameter("pwd");
if ( c_name !=null && c_name.length() >0 ){
c_name = new String( c_name.getBytes("ISO-8859-1"), "UTF-8");
}
//判斷所有可輸入的欄位不可為 null，且長度大於零。
if (
e_name != null && e_name.length() >0
&& d_name != null && d_name.length() >0
&& position != null && position.length() >0
&& pwd != null && pwd.length() >0
){
Class.forName("com.mysql.jdbc.Driver");
String url = "jdbc:mysql://localhost:3306/company?user=root&password=apple&charset=utf8";
Connection con = DriverManager.getConnection(url);
Statement stmt = con.createStatement();
String strSQL = "UPDATE employee "
+"SET c_name = '" + c_name + "'"
+", e_name = '" + e_name + "'"
+", d_name = '" + d_name + "'"
+", position = '" + position + "'"
+", pwd = '" + pwd + "'"
+" WHERE ID = '" + ID +"'";
// out.print( strSQL ); 在程式為寫完前，先顯示出SQL語法是否正確。
stmt.execute(strSQL);
stmt.close();
con.close();
} //if
response.sendRedirect("index.jsp");
%>
Result：
2. message board 留言板 -- SQL
共有六個檔案來完成功能，存在 "jamespcschool / message_sql "資料夾內
index.jsp：輸入帳號密碼來登入，"確認"連結到"check.jsp"做檢查。
check.jsp(沒有畫面)：檢查錯誤導到"error.html"，檢查正確導到"guest_book.jsp"。
error.html：顯示錯誤訊息，並按一超連結回登入畫面"index.jsp"。
guest_book.jsp：先從資料庫撈出既有的留言，顯示在畫面上，依時間順序，愈新的留言愈上面。並帶上留言板以及按鈕(可將資料導到 "input.jsp")。
logout.jsp(沒有畫面)：將session 釋放，回到登入畫面。
input.jsp(沒有畫面)：將最新的留言存到資料庫，然後導回 "guest_book.jsp"，就會顯示出最新的留言。
Code：
index.jsp
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body bgcolor='skyblue'>
<a href='../index.jsp'> 回上一頁 </a><hr>
<font color='red'><b>SQL 留言板</b></font> 請登入
<form name='f1' method='post' action='check.jsp'>
帳號: <input type='text' name='act'></br>
密碼: <input type='password' name='pwd'> </br></br>
<input type='reset' value='全部清空'>
<input type='submit' value='確認送出'> <br>
</form>
</body>
</html>
Result：
check.jsp (無畫面)
<%@ page contentType="text/html; charset=UTF-8" import="java.sql.*" %>
<%
String act = request.getParameter("act");
String pwd = request.getParameter("pwd");
Class.forName("com.mysql.jdbc.Driver");
String url = "jdbc:mysql://localhost:3306/company?user=root&password=apple&charset=utf8";
Connection con = DriverManager.getConnection(url);
Statement stmt = con.createStatement();
String strSQL = "SELECT * FROM employee where e_name = '" + act + "'";
ResultSet rs = stmt.executeQuery(strSQL);
if (
pwd != null
&& rs.next()
&& rs.getString("pwd") != null
&& pwd.equals(rs.getString("pwd"))
){
session.setAttribute("uid",act);
session.setAttribute("c_name",rs.getString("c_name"));
response.sendRedirect("guest_book.jsp");
} else {
response.sendRedirect("error.html");
} //if
stmt.close();
con.close();
%>
error.html
帳號或密碼錯誤
<a href='index.jsp'>重新輸入</a>
Result：
guest_book.jsp
<%@ page contentType="text/html; charset=UTF-8" import="java.sql.*" %>
<html>
<head>
<title>留言板</title>
</head>
<%
if (session.getAttribute("uid") == null){
response.sendRedirect("error.html");
} //if
%>
<body bgcolor='skyblue'>
<font color='blue'><b><%= session.getAttribute("c_name")%></b></font> 你好！ 歡迎蒞臨 SQL 留言板</br></br>
<form name='logout' method='post' action='logout.jsp'>
<input type='submit' value='登出'>
<a href='./logout.jsp'>登出</a>
</form>
<hr>
<form name='f1' method='post' action='input.jsp'>
<textarea name='content'>請留言</textarea>
<input type='submit' value='提交'>
</form>
// 畫表格
<table border='1' width='80%'>
<%
Class.forName("com.mysql.jdbc.Driver");
String url = "jdbc:mysql://localhost:3306/company?user=root&password=apple&charset=utf8";
Connection con = DriverManager.getConnection(url);
Statement stmt = con.createStatement();
// select 資料後，依照時間反向排列，再放入 ResultSet。
String strSQL = "SELECT * FROM guest_book ORDER BY w_time DESC";
ResultSet rs = stmt.executeQuery(strSQL);
while ( rs.next() ){
out.print( "<tr><td><font color='blue'>" +rs.getString("g_name") +"</font></td>");
out.print( "<td>" +rs.getString("w_time") +"</td></tr>");
out.print( "<tr><td colspan='2'>" +rs.getString("w_content") +"</td></tr>");
}
stmt.close();
con.close();
%>
</table>
</body>
</html>
Result：
馬上留言之後，最新的留言在最上面
logout.jsp (無畫面)
<%
session.setAttribute("uid",null);
response.sendRedirect("index.jsp");
%>
input.jsp (無畫面)
<%@ page contentType="text/html; charset=UTF-8" import="java.sql.*" %>
<%
if (session.getAttribute("uid") ==null){
response.sendRedirect("error.html");
} //if
String content = request.getParameter("content");
//先將留言板內的字型轉為 UTF-8，以免產生亂碼 。
if ( content != null && content.length() >0 ){
content = new String (content.getBytes("ISO-8859-1"), "UTF-8");
//將特殊符號改成全形，也面被有心人士破壞。
content = content.replace('<','＜');
content = content.replace('>','＞');
content = content.replace('\'','’');
content = content.replace('\"','”');
Class.forName("com.mysql.jdbc.Driver");
String url = "jdbc:mysql://localhost:3306/company?user=root&password=apple&charset=utf8";
Connection con = DriverManager.getConnection(url);
Statement stmt = con.createStatement();
//將留言板的資料寫入資料庫
String strSQL = "INSERT INTO guest_book (g_name, w_content) VALUES ('"
+ session.getAttribute("c_name") +"','" +content +"')";
// out.print(strSQL); 先利用這一行來檢查 SQL 語法是否正確。
stmt.execute(strSQL);
stmt.close();
con.close();
} //if
//寫完資料後，導回"guest_book.jsp"就可顯示出所有資料。
response.sendRedirect("guest_book.jsp");
%>
No comments:
Post a Comment