WEB架構 JSP 2.0 動態網頁技術 第三版
靜態網頁範例 其他細節，請參考 http://web.nchu.edu.tw/~jlu/tutorials.shtml 的 HTML 入門 <head> <meta http-equiv="Content-Type" content="text/html;charset=Big5" /> <title>JSP</title> </head> <body> Hello 大家好 </body> </html> 其他細節，請參考 http://web.nchu.edu.tw/~jlu/tutorials.shtml 的 HTML 入門 JSP 2.0 動態網頁技術 第三版
客戶端執行的網頁語言 JSP 2.0 動態網頁技術 第三版
JSP的執行 產生的程式碼以及其類別檔在 tomcat\work\Catalina\localhost\[test\]org\apache\jsp\xxx_jsp.java JSP 2.0 動態網頁技術 第三版
研討主題 Hello World：動態 – 由 JSP 產生 <%@page contentType="text/html" pageEncoding="Big5"%> <h3 align="center"> <% out.println("Hello 大家好"); System.out.println("debug output"); %> </h3>
研討主題 Hello World ：動態 – 由 JSP 產生 動態 – 由 JSP 產生 <%@page contentType=“text/html” pageEncoding=“Big5”%> 或者 <%@page contentType=“text/html; charset=Big5”%> 請檢視網頁的原始碼 JSP 檔裡面，可以全部是 HTML 而沒有 JSP 的程式碼嗎？ 試試看
研討主題
研討主題 HTML form 元件 <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=Big5"> <title>Hello Form</title> </head> <body> <form method="get" action="http://localhost:8080/jsp/hello1.jsp"> <input type="text" value="老呂" name="name"> <input type="submit"> </form> </body> </html> 其他細節，請參考 http://web.nchu.edu.tw/~jlu/classes/examples/cgi/forms.html
研討主題 hello1.jsp <%@page contentType="text/html" pageEncoding="Big5"%> <h3 align="center"> <% request.setCharacterEncoding(“Big5”); // ??? 只有 post 有用 String name = request.getParameter("name"); out.println("Hello " + name); %> </h3>
研討主題 互動式 Hello World 若輸入為英文 (JSP 內建物件 request) 若輸入為中文 form 是 HTML 網頁，由 HTML 內呼叫遠端的 JSP 注意 GET/POST 時，網址的變化 JSP 利用 request.getParameter() 取得使用者輸入的資料 再次說明 System.out.println() 除錯時的用法 若輸入為中文 request.setCharacterEncoding("Big5"); 這個方法只適用 POST，卻無法正確處理 GET。 String name = new String(request.getParameter(“name").getBytes("ISO-8859-1"), "Big5"); 這個方法 GET/POST 都可以
研討主題 hello3.jsp <%@page contentType="text/html" pageEncoding="Big5"%> <h3 align="center"> <% String name = request.getParameter("name"); name = new String(request.getParameter("name").getBytes("ISO-8859-1"), "Big5"); out.println("Hello " + name); %> </h3>
研討主題 互動式 Hello World（強化版） 人機介面：希望能輕易的再次執行 如果使用者並未輸入任何資料？ 可以結合 if-else 敘述：例如，如果沒有任何輸入資料，則顯示 “Hello World”。 如果使用者並未輸入任何資料？ 如果沒輸入資料（或者資料錯誤），讓使用者有再次輸入的機會。 我們之後會逐步說明！
研討主題 求解：a*x2 + b*x + c = 0 接收到的資料是字串，需要轉換才能運算 Double.parseDouble()；Integer.parseInt() 如果 a = 0 或者 b2-4ac < 0 明確說明原因，並要求重新輸入：response.sendRedirect(URL) 呼叫另一個獨立網頁 轉回原網頁 請注意，這個用法相當於一個 GET；意思就是說，需要考量編碼問題
研討主題
研討主題 cal.html <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=Big5"> <title>解一元二次方程式</title> </head> <body> <form method="POST" action="cal1.jsp"> 輸入 a 值：<input type="text" name="a"/><br/> 輸入 b 值：<input type="text" name="b"/><br/> 輸入 c 值：<input type="text" name="c"/><br/> <input type="submit" value="求解"/> </form> </body> </html>
研討主題 cal1.jsp <%@page contentType="text/html" pageEncoding="Big5"%> <h3 align="center"> <% request.setCharacterEncoding("Big5"); double a = Double.parseDouble(request.getParameter("a")); double b = Double.parseDouble(request.getParameter("b")); double c = Double.parseDouble(request.getParameter("c")); double x1 = (-b + Math.sqrt(b*b - 4*a*c)) / (2 * a); double x2 = (-b - Math.sqrt(b*b - 4*a*c)) / (2 * a); out.println("x1 = " + x1 + "<br/>"); out.println("x2 = " + x2 + "<br/>"); %> </h3>
研討主題 cal3.jsp // 資料檢查 if(a == 0) { String msg = URLEncoder.encode("a 的值為 0，請重新輸入"); response.sendRedirect("cal.jsp?message=" + msg); }
研討主題 還有 jsp:forward 的用法（要說嗎???） <jsp:forward> 是一個 JSP 內建的特殊標籤 與 response.sendRedirect(URL) 功能類似，但有下列不同處： 直接呼叫，而非經由瀏覽器 被呼叫的 JSP（B.jsp） 和呼叫的 JSP（A.jsp），共享一個 request 物件 http://someurl/jsp/A.jsp?data1=ddd A.jsp 呼叫 B.jsp 時，傳遞了 data2=eee；因為 A 和 B 共用一個 request 物件，B.jsp 可以同時取得 data1 和 data2 的值 網址列只會顯示呼叫的 JSP（A.jsp）
研討主題 jsp:forward 的用法 <jsp:forward page="cal-f.jsp"> <jsp:param name="message" value="a 的值為 0，請重新輸入" /> </jsp:forward>
研討主題 練習題：寫一個程式，將使用者輸入的攝氏溫度轉換成華氏溫度 嗯，如果在範例中，使用者不小心輸入不是數字的資料（如英文、中文）呢？ 加強版：由選項按鈕（或者下拉式選單）決定究竟是攝氏轉華氏、還是華氏轉攝氏 嗯，如果在範例中，使用者不小心輸入不是數字的資料（如英文、中文）呢？ 之後，例外處理中說明
研討主題 往簡單的數位教學以及資料庫的資料處理進行 需要知道迴圈 需要知道陣列的資料型態 需要知道例外處理的方式
研討主題 請試求以下數列的總和。 求 1 到 1/35 的和 求前二十項的和 需要迴圈：for (和 while) 語法與 pattern 是否能以亂數的方式產生分母？ Math.random()
研討主題 請試求以下矩陣之和與積。 如果陣列大小改變了呢？ 這是所謂的一維陣列，還有二維、三維、…陣列
研討主題 <%@page contentType="text/html" pageEncoding="Big5"%> <% int[] a1 = new int[3]; int[] a2 = new int[3]; for(int i=0; i<a1.length; i++) { a1[i] = (int) (Math.random() * 10); a2[i] = (int) (Math.random() * 10); } int[] c = new int[3]; for(int i=0; i<c.length; i++) { c[i] = a1[i] + a2[i]; // 以下結合 table 和 Expression Lanaguage (EL) 的用法 // 可以把這段利用迴圈改寫嗎？ %>
研討主題 <table> <tr> <td>|</td><td><%=a1[0]%></td><td>|</td><td></td><td>|</td><td><%=a2[0]%></td><td>|</td> <td></td><td>|</td><td><%=c[0]%></td><td>|</td> </tr> <td>|</td><td><%=a1[1]%></td><td>|</td><td>+</td><td>|</td><td><%=a2[1]%></td><td>|</td> <td>=</td><td>|</td><td><%=c[1]%></td><td>|</td> <td>|</td><td><%=a1[2]%></td><td>|</td><td></td><td>|</td><td><%=a2[2]%></td><td>|</td> <td></td><td>|</td><td><%=c[2]%></td><td>|</td> </table>
研討主題 在之前的範例中，我們都假設使用者會依照我們的期望，輸入正確的資料，只可惜事實上，這是非常遙不可及的想法 你希望使用者輸入數字，例如 10，但是他卻輸入”a”。 你希望使用者輸入的數字不能小於 1，但是他卻輸入”-1”。
研討主題
研討主題 例外處理：try-catch 子句 try至少要配上一個catch，而finally則是可有可無。 try{ 執行敘述1; 執行敘述2; 執行敘述3; … ; //偵錯程式區塊 } catch(例外類型1 例外物件){ 執行敘述 … ; //處理例外錯誤的程式片段 catch(例外類型2 例外物件){ catch(例外類型n 例外物件){ finally{ 執行敘述 … ; //一定會執行的程式區段
例外處理的範例 <%@page contentType="text/html" pageEncoding="Big5"%> <h3 align="center"> <% request.setCharacterEncoding("Big5"); try { String input = request.getParameter("a"); int n = Integer.parseInt(input); //int n = Integer.parseInt(request.getParameter("a")); int result = 0; for(int i=1; i<=n; i++) { result = result + i; } out.println("總和 = " + result + "<br/>"); } catch(NumberFormatException e) { out.println("輸入值必須都是數字 !! <br/>"); } finally { out.println("<a href='loop-try1.html'>回首頁</a>"); %> </h3>
例外處理的範例 <%@page contentType="text/html" pageEncoding="Big5"%> <h3 align="center"> <% request.setCharacterEncoding("Big5"); try { String input = request.getParameter("a"); int n = Integer.parseInt(input); if(n < 1) { throw new Exception("輸入值不得小於 1"); } int result = 0; for(int i=1; i<=n; i++) { result = result + i; out.println("總和 = " + result + "<br/>"); } catch(NumberFormatException e) { out.println("輸入值必須都是數字 !! <br/>"); } catch(Exception e) { out.println(e.getMessage() + "<br/>"); } finally { out.println("<a href='loop-try2.html'>回首頁</a>"); %> </h3>
usingMultiCatch.jsp <%@page contentType="text/html“ pageEncoding="Big5"%> <html> <head><title>多重catch子句</title></head><body> <% try{ String input = request.getParameter("input"); int intNumber = Integer.parseInt(input); out.print("您指定的陣列數目："+ intNumber + "<br><br>" ); int a[]=new int[intNumber]; for(int i=0;i<=intNumber;i++){ a[i]=i*10 ; out.println(a[i]+ "<br>") ; } } catch(NumberFormatException e){ out.println("網址列的參數不正確 !! <br>") ; out.println("請在參數列輸入整數值 !! <br>") ; } catch(ArrayIndexOutOfBoundsException e){ out.println("超出陣列大小"); } finally { out.println("<b><br><br>程式執行結束 !! <b>"); %> </body></html>
研討主題 catch 內程式的設計原則： 儘可能反應”例外“發生的原因 進可能讓使用者有機會彌補錯誤
研討主題 Exception 類別： 例外處理機制，建構在一組預先設計好的例外類別之上，JSP 藉由各種例外類別，處理程式中各種可能所發生的錯誤。 java.lang.Execption 類別為所有例外類別的基礎類別；放置於最後一個 catch。 例外類別 說明 NumberFormatException 字串無法轉換的例外。 ArithmeticException 數學運算所產生的例外。 ArrayIndexOutOfBounds-Exception 陣列索引值超出陣列大小的例外。 NullPointerException 參考物件為 null 的例外。
研討主題 練習題：a*x2 + b*x + c = 0 如果 a = 0 或者 b2-4ac < 0 如果輸入的不是數字 明確說明原因，並要求重新輸入 a、b、c 的值都由亂數產生器產生（可以是整數）
研討主題 簡易的系統分析與 ERD（實體關聯圖） 流程以畫面呈現
研討主題 加入會員
研討主題 登入
研討主題 實體關聯圖 學號 + 課程編號 PK（主鍵）以及 FK（外來鍵） 記得要加上”index”（索引）
研討主題 資料庫練習題（分組作業） 以 Course, Student, Grade 為例 請顯示每一位學生修課的總學分數（含未修任何學分的學生） 請顯示每一位學生的平均分數 請顯示每個學生所修的課程（常見於明細表） XXX DB Programming YYY Architecture ZZZ English Accounting
研討主題 資料庫的安裝 JDBC 的安裝 http://web.nchu.edu.tw/~jlu/cyut/mysql.shtml 在 \mysql的目錄下建立 startup.bat start e:\mysql\bin\mysqld --defaults-file=my.ini --console 在 \mysql的目錄下建立 shutdown.bat e:\mysql\bin\mysqladmin –u root –p shutdown JDBC 的安裝 Connector/J: http://dev.mysql.com/downloads/connector/j/ http://web.nchu.edu.tw/~jlu/cyut/mysql-jdbc.shtml
研討主題 資料庫練習題（分組作業） 請利用 MySQL 建立 Course, Student, Grade 表格，並建立範例資料；以 SQL 語法呈現下列結果 請顯示每一位學生修課的總學分數（含未修任何學分的學生） 請顯示每一位學生的平均分數
AppServ 如果你在其他課程已經安裝了 AppServ 又不能解除安裝：
研討主題 JSP 查詢 MySQL 資料 <form method="post" action="http://localhost:8080/jsp/query1.jsp"> Price > <input type="text" value="100" name="price" size="20"><br> <input type="submit"> </form>
研討主題 <%@ page contentType=“text/html;charset=Big5” language=“java” import="java.sql.*" %> <html> <!-- 加上 ！ 宣告成為類別的屬性，否則便成為方法內的變數。 --> <%! private Connection conn = null; public void jspInit() { try { Class.forName(“com.mysql.jdbc.Driver”); // 載入 JDBC 驅動程式 // 請記得設定適當的 UID 和 PWD。 conn = DriverManager.getConnection("jdbc:mysql://127.0.0.1/eric", "jlu", "abcd"); } catch (Exception e) { System.out.println("Fail to connect to database."); } public void jspDestroy() { conn.close(); System.out.println("Fail to close connection."); %>
研討主題 <% String salary = request.getParameter("price"); String aQuery = null; try { aQuery = "select * from Product where Price > " + salary; %> <head><title>Database Query</title></head> <body> // Construct a SQL statement and submit it Statement aStatement = conn.createStatement(); ResultSet rs = aStatement.executeQuery(aQuery);
研討主題 <% ResultSetMetaData rsmeta = rs.getMetaData(); int cols = rsmeta.getColumnCount(); // contruct table out.println("<table border=\"1\">"); out.println("<tr>"); // Display column headers for(int i=1; i<=cols; i++) { out.print("<th>"); out.print(rsmeta.getColumnLabel(i)); out.print("</th>"); } out.println("\n</tr>");
研討主題 // Display query results. while(rs.next()) { out.print("<tr>"); for(int i=1; i<=cols; i++) { out.print("<td>"); out.print(rs.getString(i)); out.print("</td>"); } out.println("</tr>"); // Clean up rs.close(); aStatement.close(); } catch (Exception e) { System.out.println("Exception Occurs: " + e); %> </body></html>
研討主題 多網頁的系統 JSP 的生命週期 以資料的修改為例 原始碼http://web.nchu.edu.tw/~jlu/classes/jsp/update.zip JSP 的生命週期 經由生命週期的了解，可以提升 JSP 的效能 http://web.nchu.edu.tw/~jlu/cyut/jsp.shtml#life
研討主題 多網頁的系統
研討主題 多網頁的系統
研討主題 多網頁的系統
研討主題 多網頁的系統
研討主題 多網頁的系統：如果不是 radio button，而是 checkbox 呢？ type 改成 checkbox（所有同一組 checkbox 的名稱仍維持相同）
研討主題 多網頁的系統： 利用 String[] input = request.getParameterValues(“n1”);
研討主題 Session http://web.nchu.edu.tw/~jlu/cyut/jsp-session.shtml 主要功能： 可以在網頁之間傳遞資料（比之前的 hidden 有效率） session.setAttribute() 和 session.getAttribute() 可以避免使用者在多網頁的過程中，利用”我的最愛”或者直接輸入 URL 的方式切入某一特定網頁 isNew() 和 invalidate() 與 Session 結合的 Connection session.setAttribute(“conn”, conn); Connction conn = session.getAttribute(“conn”);
研討主題 何謂資料庫的交易（Transaction）？ 交易以一個批次為單位執行數個獨立的SQL敘述。 交易將操作資料庫的動作視為不可分割的過程。 一旦執行過程中某段SQL執行發生錯誤，則先前所有執行完畢的步驟都將失效，只有整個交易過程成功執行完成之後，所有SQL敘述的異動內容才會整個生效。
交易的狀態必須由 Connection 作設定。 交易方法 交易的狀態必須由 Connection 作設定。 setAutoCommit ()用來設定是否目前的連線處於交易狀態。 rollback()為取消交易的任何動作，將所有狀態回復到未執行任何操作的初始狀態。 commit()則是確認所有交易的動作。
交易過程
以 Select3.jsp 為例 <%@ page contentType="text/html;charset=Big5“ import="java.sql.*" %> <html> <%! private Connection conn = null; public void jspInit() { try { Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); conn = DriverManager.getConnection("jdbc:odbc:csie", "jlu", “newpass"); conn.setAutoCommit(false); } catch (Exception e) { System.out.println("Fail to connect to database."); } public void jspDestroy() { conn.close(); System.out.println("Fail to close connection."); %>
以 Select3.jsp 為例 <head><title>Database Update</title></head> <body> <% // 取得 Select1.jsp 傳過來的資料 String num = request.getParameter("num"); String name = request.getParameter("name"); String price = request.getParameter("price"); String qty = request.getParameter("qty"); // 建立 update SQL 指令；請小心 SQLInjection 的攻擊 // 應該仔細檢查收到的資料是否符合正確格式 String uSQL = "update Product set name='" + name + "', price=" + price + ", qty=" + qty + " where id=" + num;
以 Select3.jsp 為例 try { Statement stmt = conn.createStatement(); if(stmt.executeUpdate(uSQL) > 0) { conn.commit(); out.println("<h3 align='center'>修改成功</h3>"); out.println("<a href='Select1.jsp'>繼續修改資料</a>"); } else { throw new SQLException("資料修改失敗"); } stmt.close(); } catch (Exception e) { conn.rollback(); System.out.println("Exception Occurs: " + e); %> </body></html>
研討主題 安全連線（https） 優點：對現有的程式沒有任何影響 http://web.nchu.edu.tw/~jlu/cyut/tomcat55.shtml
研討主題 O’Reilly 上傳套件 下載位置 http://www.servlets.com/cos/ 下載檔案 cos-26Dec2008.zip 解壓縮，並將 lib\cos.jar 安裝於 tomcat\common\lib、 tomcat\shared\lib、或者 webapps\test\WEB-INF\lib （僅供 test 使用） 重新啟動 tomcat
MultipartRequest方法成員 說明 getFileNames() 取得包含所有檔案上傳檔案名稱的Enumeration物件。 getFilesystemName(fieldName) 取得檔案名名稱。 getContentType(fieldName) 取得檔案名型態。 getFile(fieldName) 取得File檔案物件。
檔案上傳的表單範例 <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=Big5"> <title></title> </head> <body> <form action=“uploadfiles.jsp" enctype="multipart/form-data“ method="post" > <input type=“file” name=“file1” size=“50” /> <br> <input type=“file” name=“file2” size=“50” /> <br> <input type=“submit” value="上傳" /> <input type="reset" value="清除"/> </form> <div align="center"><font color="red">上傳檔案最大不能大於 10MB</font></div> </body> </html>
檔案上傳的表單範例
檔案上傳的 JSP 程式 <%@page contentType="text/html" pageEncoding="Big5"%> <%@page import="com.oreilly.servlet.MultipartRequest"%> <%@page import="java.io.*"%> <%@page import="java.util.*"%> <html> <head><title>上傳檔案作業-O'Reilly</title></head> <body> <% // 第二個參數指的是檔案儲存位置，範例使用 d:\tomcat\temp // 第三個參數為限制上傳檔案大小：範例為 10MB // 第四個參數使得可以正確顯示上傳中文檔案的名稱 // 這行敘述執行完，檔案已經上傳完畢。 MultipartRequest theMultipartRequest = new MultipartRequest(request,”D:\\tomcat\\temp\\",10*1024*1024, “Big5”) ;
檔案上傳的 JSP 程式 // 這之後的都只是顯示用的 String f1 = mrequest.getFilesystemName("file1"); String f2 = mrequest.getFilesystemName("file2"); if(f1 != null) out.println(f1 + "<br>"); if(f2 != null) out.println(f2 + "<br>"); out.println("成功上傳案上列檔案"); %> </body> </html>
檔案上傳的 JSP 程式
研討主題 練習題：修改上傳程式，使得 顯示上傳檔案的大小 假設只限制能上傳 word 檔 利用 java.io.File 的 length() 假設只限制能上傳 word 檔 檢查方式：副檔名，以及 content type
研討主題 Java Mail 重新啟動 tomcat 由 Java (servlet/JSP) 程式傳送 email 的套件 JavaMail API 1.4.4 下載位置： http://www.oracle.com/technetwork/java/index-138643.html 如果你安裝的 JDK 不是 1.6.x 版以上，使用 JavaMail API，必須利用到 JavaBeans Activation Framework (JAF)，因此也需要下載安裝 JAF 檔案解壓縮之後，將 mail.jar 和 activation.jar 安裝於 tomcat\common\lib、 tomcat\shared\lib、或者 webapps\test\WEB-INF\lib （僅供 test 使用） 重新啟動 tomcat
JSP網頁發送電子郵件
傳送郵件程式碼 <%@page contentType="text/html“ pageEncoding="Big5"%> <%@page import ="java.util.*,java.io.*,javax.mail.*,javax.mail.internet.*,javax.activation.*"%> <html> <head><title>JavaMail</title></head> <body> <% // 設定寄件郵件伺服器，需要依據你的 ISP 的設定而改變 Properties theProperties = System.getProperties() ; theProperties.put("mail.host",“dragon.nchu.edu.tw") ; theProperties.put("mail.transport.protocol","smtp") ; // 此 session 不是 JSP 的 session，而是代表一個 email 的對話 Session theSession = Session.getDefaultInstance(theProperties,null) ; theSession.setDebug(false) ;
傳送郵件程式碼 // 一封 email 的資訊，含表頭以及內容 MimeMessage theMessage = new MimeMessage(theSession) ; // email 的送信人 theMessage.setFrom(new InternetAddress("sean@testServer.com.tw") ) ; // email 的收件人 theMessage.setRecipients(Message.RecipientType.TO,"tim@nantay.com.tw") ; // 一次設定多個收件人 // theMessage.setRecipients(Message.RecipientType.TO, // InternetAddress.parse(“A@edu.tw,B@com")); // email 的標題 theMessage.setSubject("JavaMail 測試郵件", "Big5") ; // email 的內容 theMessage.setText("JSP與JavaMail測試郵件內容..." , "Big5") ; // 將 email 寄送出去 Transport.send(theMessage) ; out.println("郵件寄送完成") ; %> </body> </html>
收集送信資訊 使用MimeMessage必須提供的幾項重要資訊 。 參數項目 方法 說明 寄信來源 setFrom() 寄信人電子郵件位址。 收信目的 setRecipients() 收信人電子郵件位址。 信件主旨 setSubject() 設定郵件主旨。 信件內容 setText() 設定郵件內容。
收集送信資訊 而RecipientType代表所要傳送的型態 。 型態 說明 Message.RecipientType.TO 郵件收件人。 Message.RecipientType.CC 副本收件人。 Message.RecipientType.BCC 副本密件收件人
研討主題 畫面：（Batman 寄信給我耶）
研討主題 練習題： 請為 JavaMail 程式設計一個寫信的介面（HTML form 表單），然後由 JSP 程式來傳送信件。
研討主題 web.xml 系統常用資訊的存放地；例如，dsn、port、username、password 等 http://web.nchu.edu.tw/~jlu/cyut/jsp.shtml#web 請利用 web.xml 定義連結資料庫時所用到的資訊，然後你的 jsp 程式可以讀取這些資料。 可以包含 JDBC 的驅動程式名稱，URL、帳號/密碼等。
研討主題 數字的格式化 一般來說，我們在 JSP 處理的數字大多為 int、double 等資料型態。 java.text.DecimalFormat 或者 JSP 的 JSTL
研討主題 import java.text.*; public class TestFormat { public static void main (String argv[]) { double x = 2.0, y = 3.0; System.out.println("x / y = " + x/y); DecimalFormat two = new DecimalFormat("0.00"); System.out.println("x / y = " + two.format(x/y)); // 先行零不顯示 DecimalFormat thr = new DecimalFormat("#.00"); System.out.println("x / y = " + thr.format(x/y)); DecimalFormat fou = new DecimalFormat("$#,##0.00"); System.out.println("x / y = " + fou.format(x/y)); System.out.println("1234567.123456 = " + two.format(1234567.123456)); System.out.println("1234567.123456 = " + fou.format(1234567.123456)); }
研討主題 經由之前的討論，我們可以得知，我們範例程式的輸出結果會像 x / y = 0.6666666666666666 1234567.123456 = 1234567.12 1234567.123456 = $1,234,567.12
研討主題 安裝 JSTL 1.1: http://tomcat.apache.org/taglibs/standard/ 解壓縮後，將 jstl.jar 和 standard.jar 放置於 tomcat 的適當位置 如果使用 1.1.2 版，課本的 usingformatNumber.jsp 有錯，需要把 “${20001000.123}” 改成 “20001000.123”
研討主題 <%@page contentType="text/html" pageEncoding="Big5"%> <%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%> <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <% double x = 123456789.123456789123456789; double y = 20000000 / 3.0; %> <html> <head><title>數值格式化</title></head> <body> <table border="1" width="100%"> <tr> <th width="20%">格式</th> <th width="40%">輸出 x</th> <th width="40%">輸出 y</th> </tr> <td align=right>原始數值</td> <td> <fmt:formatNumber value="<%=x%>"/> </td> <td> <fmt:formatNumber value="<%=y%>"/> </td>
研討主題 <tr> <td align=right>移除分隔符號</td> <td><fmt:formatNumber value="<%=x%>" groupingUsed='false'/></td> <td><fmt:formatNumber value="<%=y%>" groupingUsed='false'/></td> </tr> <td align=right>最大2位整數</td> <td><fmt:formatNumber value="<%=x%>" maxIntegerDigits='2'/></td> <td><fmt:formatNumber value="<%=y%>" maxIntegerDigits='2'/></td> <td align=right>最小12位整數</td> <td><fmt:formatNumber value="<%=x%>" minIntegerDigits='12'/></td> <td><fmt:formatNumber value="<%=y%>" minIntegerDigits='12'/></td> <td align=right>最大2位小數</td> <td><fmt:formatNumber value="<%=x%>" maxFractionDigits='2'/></td> <td><fmt:formatNumber value="<%=y%>" maxFractionDigits='2'/></td>
研討主題 <tr> <td align=right>新台幣</td> <!-- USD: 美金；CNY:人民幣 --> <td><fmt:formatNumber value="<%=x%>" type="currency" currencyCode="TWD"/> <td><fmt:formatNumber value="<%=y%>" type="currency" currencyCode="TWD"/> </td> </tr> <td align=right>自訂樣式(#.####E0)</td> <td><fmt:formatNumber value="<%=x%>" pattern="#.####E0"/> <td><fmt:formatNumber value="<%=y%>" pattern="#.####E0"/> </table> </body> </html>
研討主題
研討主題 日期的格式化 若是字串，我們需要利用 indexOf() 的方法將年、月、日分開。（也可以使用 StringTokenizer） 一般來說，在 JSP 中需要處理的日期大部分分成兩種；一種是字串，另一種是資料庫（JDBC）回傳的 java.sql.Date。 若是字串，我們需要利用 indexOf() 的方法將年、月、日分開。（也可以使用 StringTokenizer） 若是 java.sql.Date java.sql.Date 是 java.util.Date 的子類別，所以可以使用 getYear()［西元年 – 1900］、getMonth()［1 月為 0］、getDate()、getHours()、getMinutes()、以及 getSeconds() 來取得資料 但是，java.util.Date 的方法大多都 deprecated。
研討主題 <%@page contentType="text/html" pageEncoding="Big5" import="java.util.*"%> <h3 align="center"> <% Date date = new Date(); int yy = date.getYear(); int mm = date.getMonth(); int dd = date.getDate(); int hh = date.getHours(); int mi = date.getMinutes(); int ss = date.getSeconds(); %> 系統時間：民國 <%=yy-11%> 年 <%=mm+1%> 月 <%=dd%> 日 <%=hh%> 時 <%=mi%> 分 <%=ss%> 秒 </h3>
研討主題
研討主題 <%@page contentType="text/html" pageEncoding="Big5" import="java.util.*"%> <%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%> <% Date nowDateTime = new Date(); %> <html> <head><title>日期時間格式化</title></head> <body> <table border="1" width="100%"> <tr> <th width="50%">格式</th> <th width="50%">輸出</th> </tr> <td width="50%" align=right>原始日期時間表示式</td> <td width="50%"> <fmt:formatDate value="<%=nowDateTime%>" type="both" dateStyle="full" timeStyle="full" /> </td>
研討主題 <tr> <td width="50%" align=right>medium日期</td> <fmt:formatDate value="<%=nowDateTime%>" type="date" dateStyle="medium" /> </td> </tr> <td width="50%" align=right>medium時間</td> <fmt:formatDate value="<%=nowDateTime%>" type="time" timeStyle="medium" /> <td width="50%" align=right>MM-dd-yyyy HH:mm:ss</td> <fmt:formatDate value="<%=nowDateTime%>" type="date" timeStyle="medium" pattern="MM-dd-yyyy HH:mm:ss"/> </table> </body> </html>
研討主題
研討主題 Open Flash Chart 2 與 JOFC2 套件 是一種讓網頁可以輕易產生圖表的方式 http://web.nchu.edu.tw/~jlu/cyut/ofc2/ofc2.shtml
研討主題 ZK 是一種結合前、端端的開發平台 http://web.nchu.edu.tw/~jlu/classes/xml/ajax/ZK.shtml