19
1 JSP JSP (Java Server Pages): คือ Script language ที่ทำงำนบนเครื่อง server เช่นเดียวกับ perl, php asp หรือ cold fusion เป็นต้น โดยมีโครงสร้ำงภำษำแบบ JAVA หรือเป็น JAVA ประเภทหนึ ่ง แต่มำเขียนให้อยู่ในรูปของ HTML แต่เมื่อจะใช้งำนตัว File JSP จะถูกแปลงให้เป็น file ของ JAVA โครงสร้างของ JSP โครงสร้ำงของ JSP นั ้นเป็นลักษณะของแท็ก (tag) ชนิดพิเศษที่แทรกเข้ำไปในเอกสำร HTML และเปลี่ยนนำมสกุลของเอกสำรเป็น . JSP แทนที่จะเป็น . HTM หรือ . HTML โดยแท็ก เหล่ำนี ้เว็บบรำวเซอร์จะไม่สำมำรถตีควำมหมำยได้ จะต้องนำไปประมวลผลก่อนที่เว็บเซิร์ฟเวอร์ เท่ำนั ้น (หรือที่เรำเรียกว่ำกำรทำงำนแบบ Server Side) แล้วนำผลลัพธ์ทั ้งหมดส่งกลับมำยัง เว็บบรำวเซอร์ในลักษณะของเอกสำร HTML ซึ ่งเว็บบรำวเซอร์สำมำรถตีควำมหมำยและนำ มำแสดงผลได้ กำรทำงำนโดยรวมของ JSP จะเริ่มจำกบรำวเซอร์ร้องขอ ( HTTP Request) เอกสำรทีมีนำมสกุลเป็น JSP ไปยังเว็บเซิร์ฟเวอร์ผ่ำนทำงโปรโตคอล HTTP เว็บเซิร์ฟเวอร์ก็จะนำเอกสำร JSP ที่ได้รับมำนั ้นส่งต่อไปใหJSP Engine (JSP Engine คือ แอพลิเคชันที่ถูกโหลดสู่หน่วยควำมจำ และทำงำนอยู่บนเว็บเซิร์ฟเวอร์ หน้ำที่หลักคือแปลควำมหมำยและประมวลผลเอกสำร JSP) จำกนั ้น JSP Engine ก็จะประมวลผล และส่งผลลัพธ์กลับมำยังเว็บเซิร์ฟเวอร์ แล้วเว็บเซิร์ฟเวอร์ก็จะ ส่งผลลัพธ์กลับมำยังบรำวเซอร์ (HTTP Response) อีกที ในลักษณะของเอกสำร HTML บรำวเซอร์ ก็จะสำมำรถแสดงผลได้

lesson5 JSP

Embed Size (px)

Citation preview

Page 1: lesson5 JSP

1

JSP JSP (Java Server Pages): คอ Script language ทท ำงำนบนเครอง server เชนเดยวกบ perl,

php asp หรอ cold fusion เปนตน โดยมโครงสรำงภำษำแบบ JAVA หรอเปน JAVA ประเภทหนง แตมำเขยนใหอยในรปของ HTML แตเมอจะใชงำนตว File JSP จะถกแปลงใหเปน file ของ JAVA

โครงสรางของ JSP โครงสรำงของ JSP นนเปนลกษณะของแทก (tag) ชนดพเศษทแทรกเขำไปในเอกสำร

HTML และเปลยนนำมสกลของเอกสำรเปน . JSP แทนทจะเปน .HTM หรอ .HTML โดยแทกเหลำนเวบบรำวเซอรจะไมสำมำรถตควำมหมำยได จะตองน ำไปประมวลผลกอนทเวบเซรฟเวอรเทำนน (หรอทเรำเรยกวำกำรท ำงำนแบบ Server Side) แลวน ำผลลพธทงหมดสงกลบมำยง เวบบรำวเซอรในลกษณะของเอกสำร HTML ซงเวบบรำวเซอรสำมำรถตควำมหมำยและน ำ มำแสดงผลได

กำรท ำงำนโดยรวมของ JSP จะเรมจำกบรำวเซอรรองขอ (HTTP Request) เอกสำรท มนำมสกลเปน JSP ไปยงเวบเซรฟเวอรผำนทำงโปรโตคอล HTTP เวบเซรฟเวอรกจะน ำเอกสำร JSP ทไดรบมำนนสงตอไปให JSP Engine (JSP Engine คอ แอพลเคชนทถกโหลดสหนวยควำมจ ำและท ำงำนอยบนเวบเซรฟเวอร หนำทหลกคอแปลควำมหมำยและประมวลผลเอกสำร JSP) จำกนน JSP Engine กจะประมวลผล และสงผลลพธกลบมำยงเวบเซรฟเวอร แลวเวบเซรฟเวอรกจะสงผลลพธกลบมำยงบรำวเซอร (HTTP Response) อกท ในลกษณะของเอกสำร HTML บรำวเซอรกจะสำมำรถแสดงผลได

Page 2: lesson5 JSP

2

ขอดของ JSP 1. Write Once Run Anywhere : กำรท ำงำนไดในหลำยระบบปฏบตกำรไมวำจะเหน

Mac OS, Linux และ Windows 2. Component Reusable : ดวยควำมสำมำรถในกำรน ำจำวำบน (Java Bean) มำใช ซง

มลกษณะเปนคอมโพเนนต ท ำใหคอมโพเนนตเหลำนสำมำรถน ำกลบมำใชไดใหมและใชรวมกนระหวำงผพฒนำเวบไซตท ำใหกำรพฒนำท ำไดเรวขน เชน หำกเรำสรำงคอมโพเนนต ทท ำกำรเชอมตอกบฐำนขอมลไว เมอมกำรสรำงเอกสำร JSP ใหมขนมำและตองกำรเชอมตอกบฐำนขอมล กจะท ำไดโดยกำรเรยกใชคอมโพเนนตทไดสรำงไวแลว

3. JAVA Extension : JSP มคณสมบตหลำยอยำงไมวำจะเปน กำรโปรแกรมเชงวตถ(Object Oriented Programming) ,กำรท ำงำนกบ Thread (Multithreading) และ กำรจดกำรกบขอผดพลำด (Error Handling)

4. Separation of Dynamic and Static Content กำรแยกจำกกนระหวำงสวนทเปนไดนำมก เชน ขอมล กบสวนทเปนสแตตก เชน แทก HTML ตำง ๆ ท ำใหกำรดแลและพฒนำเวบไซตงำยขน

SQL เอสควแอล (SQL) คอ ภำษำสอบถำมขอมล หรอภำษำจดกำรขอมลอยำงมโครงสรำง

มกำรพฒนำภำษำคอมพวเตอร และโปรแกรมฐำนขอมลทรองรบมำกมำย เพรำะจดกำรขอมลไดงำย เชน MySQL, MsSQL, PostgreSQL หรอ MS Access เปนตน ส ำหรบโปรแกรมฐำนขอมล ทไดรบควำมนยมคอ MySQL เปน Open Source ทใชงำนไดทงใน Linux และ Windows SQL เปนภำษำทใชในกำรเขยนโปรแกรม เพอจดกำรกบฐำนขอมลโดยเฉพำะ สำมำรถแบงกำรท ำงำน ไดเปน 4 ประเภท ดงน

1. Select query ใชส ำหรบดงขอมลทตองกำร 2. Update query ใชส ำหรบแกไขขอมล 3. Insert query ใชส ำหรบกำรเพมขอมล 4. Delete query ใชส ำหรบลบขอมลออกไป

Page 3: lesson5 JSP

3

Select query ใชในกำรดงขอมลในฐำนขอมล จะมกำรคนหำรำยกำรจำกตำรำงในฐำนขอมล ตงแตหนง

ตำรำงขนไป ตำมเงอนไขทสง ผลลพธทไดจะเปนเซตของขอมลทสำมำรถสรำง เปนตำรำงใหม หรอใชแสดงออกมำทำงจอภำพเทำนน โดยมรปแบบดงน

Select (รำยละเอยดทเลอก) Form (ตำรำงแหลงทมำ) Where (ก ำหนดเงอนไขฐำนขอมลทเลอก) Group by (ชอคอลมน)

ค าสงคนหาขอมล (Query Statement) ค ำสง SELECT เปนค ำสงกำรเรยกดขอมล หรอ คนหำขอมล ตำมเงอนไขทระบ เนองจำก

ค ำสง SELECT เปนค ำสงทมรปแบบกำรใชงำนทงำยเพอชวยในกำรคนหำขอมลทซบซอน ดงมรปแบบดงน

SELECT <ชอคอลมนทตองกำรดขอมล>

FROM <ชอตำรำง>

WHERE <เงอนไขตำมทระบ>

SELECT --- เปนค ำสงใหท ำกำรเรยกดขอมลในคอลมนทระบ ซงอำจจะมำกกวำหนงกไดและถำม

มำกกวำหนงคอลมนตองคนดวย คอมมำ (,) และนอกจำกนยงสำมำรถใชเครองหมำย

ดอกจน (*) เพอแสดงถงกำรขอดขอมลทงหมดไดอกดวย

FROM --- เปนสวนประกอบของค ำสงทบอกถงตำรำงทตองกำรดซงอำจจะมมำกกวำหนงตำรำงก ไดทจะถกเรยกใชจำกค ำสง SELECT

WHERE--- เปนสวนประกอบของค ำสง ทใชบงบอกเงอนไขทจะใชในกำรคนหำขอมล ขนมำจำกตำรำงใดๆ ทอยหลง FROM น

Page 4: lesson5 JSP

4

รปแบบการใชงาน ค าสงการคนหา/แสดงขอมล ค ำสง SQL SELECT สำมำรถเรยกไดทงตำรำง หรอวำ สำมำรถระบฟลดทตองกำรเรยกด

ขอมลได ยกตวอยางเชน

กำรเลอกขอมลทงหมดของ Table

ค ำสง SQL WHERE เปนค ำสงทใชส ำหรบกำรระบเงอนไขกำรเลอกขอมลในตำรำง (Table) ค ำสง SQL WHERE สำมำรถระบเงอนไขในกำรเลอกขอมลได 1 เงอนไข หรอ มำกกวำ 1 เงอนไข ยกตวอยางเชน 1. กำรเลอกขอมลโดยใช Operators = (เทำกบ)

2. กำรเลอกขอมลโดยใช ค ำสง LIKE

Page 5: lesson5 JSP

5

ขอสงเกต 1. ประโยคยอย WHERE เรำสำมำรถระบเงอนไขไดโดยใชโอเปอรเรเตอร ทวไป เชน

NOT < > = กรณทคอลมนเปนตวเลข เรำกสำมำรถระบเงอนไขทเปนกำรค ำนวณไดเชน +,-,*,/ 2. ค ำวำ Like ใชกบคำในคอลมนประเภทตวอกษรวำตรงกบประโยคทตองกำรหรอไม เรำสำมำรถใชเครองหมำย widecard เ ชน * ,??,% ในประโยคได ตำมตวอยำงขำงตน 3. ในกำรค ำนวณนนมฟงกชน COUNT,SUM,AVG.MIN,MAX ซงสำมำรถน ำมำใชได เชนSelect Count(id) From stdinfo หมำยถง ใหแสดงจ ำนวนรำยกำรท งหมดในตำรำง 4. ในกรณทตำรำงสองตำรำงมควำมสมพนธกน เรำกสำมำรถดขอมลทงสองตำรำงพรอมกนได เชน ตำรำงท 1 ขอมลนกศกษำชอ stdinfo ก ำหนดใหมคอลมนรหสประจ ำตว (id) ,ชอ (fname), นำมสกล (lname) ตำรำงท 2 ขอมลเกยวกบวชำทเรยน ชอ substd ก ำหนดใหมคอลมนชอวชำ (subject), รหสประจ ำตวอำงอง (rid) ,อำจำรยผสอน (teacher) ตองกำรดขอมลรหสประจ ำตว ชอ นำมสกล และชอวชำทเรยน เรำจะใชค ำสงดงน SELECT stdinfo.id,stdinfo.fname,stdinfo.lname,substd.subject FROM stdinfo,substd WHERE stdinfo.id=substd.rid

Page 6: lesson5 JSP

6

วธใชงาน ค าสงการคนหา/แสดงขอมล

การสรางหนา JSP

1. คลกขวำท WebContent --> New --> JSP file แลวตงชอวำ Search.jsp

2. เขยนค ำสงหนำ Search.jsp ใหแสดงผลออกมำดงหนำ Web Pageโดยมตวเลอกใหผใช

สำมำรถเลอกได 3 กรณ คอ คนหำจำกทงหมด , คนหำจำกชอ และคนหำจำกชอทใกลเคยง

Page 7: lesson5 JSP

7

การสรางหนา SearchServlet.java

1. คลกขวำท Package com.controller --> New --> Servlet แลวตงชอวำ SearchServlet

2. เขยนโคดหนำ SearchServlet. java ซงเขยนใน Method doPost

Page 8: lesson5 JSP

8

การสรางหนา MemberDAO.java

3. เขยนโคดหนำ MemberDAO.java

การเขยนโคดโดยเลอกจากขอมลทงหมดของ Table

ผลลพธของการรนโปรแกรม

Page 9: lesson5 JSP

9

การเขยนโคดโดยเลอกจากขอมลบางฟลดโดยใช Operators = (เทากบ)

ผลลพธของการรนโปรแกรม

Page 10: lesson5 JSP

10

การเขยนโคดโดยเลอกจากขอมลบางฟลดโดยใช ค าสง LIKE

ผลลพธของการรนโปรแกรม

Page 11: lesson5 JSP

11

การเขยนโคดหนา SearchServlet..java

4. เขยนโคดหนำ SearchServlet..java เพอเรยกใช Class MemberDAO และกำรเขยนเงอนไขในกำรเลอกใช Combo box

การเขยนโคดหนา Search.jsp

5. เขยนโคดหนา Search.jsp เพอใหแสดงขอมลจากผลการคนหา

Page 12: lesson5 JSP

12

Code Class Search

<body> <form action="SearchServlet" method="post"> <center> <table> <tr> <td> <select name="trpe"> <option value="00" selected="selected">กรณำเลอก</option> <option value="all">คนหำจำกทงหมด</option> <option value="name">คนหำจำกชอ</option> <option value="namelike">คนหำจำกชอใกลเคยง</option></select> </td> <td><input type="text" id="keyword" name="keyword"></td> <td><input type="submit" value="คนหา"></td> </tr> </table> </center> <%ArrayList<MembersBean> memberlist = (ArrayList<MembersBean>)request.getAttribute("member"); if(memberlist != null){%> <center> <table border="2"> <tr> <td align="center">ล ำดบ</td> <td align="center">User</td> <td align="center">Password</td> <td align="center">ชอ</td>

Page 13: lesson5 JSP

13

<td align="center">นำมสกล</td> <td align="center">แกไข</td> <td align="center">ลบ</td> </tr> <%for(int i=0;i<memberlist.size();i++){ MembersBean mem = (MembersBean)memberlist.get(i);%> <tr> <td><%=mem.getMember_id() %></td> <td><%=mem.getMember_username() %></td> <td><%=mem.getMember_password() %></td> <td><%=mem.getMember_firstname() %></td> <td><%=mem.getMember_lastname() %></td> <td><a href="#">แกไข</a></td> <td><a href="#">ลบ</a></td> </tr> <% }%> </table> </center> <% }%> </form>

</body>

Page 14: lesson5 JSP

14

Code Class MembersDAO //Method ทใชเรยกแสดงผลทงตำรำง public ArrayList<MembersBean> getAllMembers(){ ArrayList<MembersBean> memlist = new ArrayList<MembersBean>(); MembersBean mem = new MembersBean(); String sql ="SELECT * FROM membersbook"; try{ dbc.createConnection(); stmt = dbc.getStatement(); rs = stmt.executeQuery(sql); while(rs.next()){ mem = new MembersBean(); mem.setMember_id(rs.getInt("member_id"));

mem.setMember_username(rs.getString("member_username")); mem.setMember_password(rs.getString("member_password")); mem.setMember_firstname(rs.getString("member_firstname")); mem.setMember_lastname(rs.getString("member_lastname")); mem.setMember_sex(rs.getString("member_sex")); mem.setMember_address(rs.getString("member_address")); mem.setMember_county(rs.getString("member_county")); mem.setMember_email(rs.getString("member_email")); mem.setMember_number(rs.getString("member_number")); mem.setMember_image(rs.getString("member_image")); memlist.add(mem); } }catch(SQLException e){ e.printStackTrace(); } return memlist; }

Page 15: lesson5 JSP

15

//Method ทใชเรยกแสดงผลชอออกมำ public ArrayList<MembersBean> getAllMembersByName(String name){ ArrayList<MembersBean> memlist = new ArrayList<MembersBean>(); MembersBean mem = new MembersBean(); String sql ="SELECT * FROM membersbook WHERE member_firstname ='"+name+"' "; try{ dbc.createConnection(); stmt = dbc.getStatement(); rs = stmt.executeQuery(sql); while(rs.next()){ mem = new MembersBean(); mem.setMember_id(rs.getInt("member_id")); mem.setMember_username(rs.getString("member_username")); mem.setMember_password(rs.getString("member_password")); mem.setMember_firstname(rs.getString("member_firstname")); mem.setMember_lastname(rs.getString("member_lastname")); mem.setMember_sex(rs.getString("member_sex")); mem.setMember_address(rs.getString("member_address")); mem.setMember_county(rs.getString("member_county")); mem.setMember_email(rs.getString("member_email")); mem.setMember_number(rs.getString("member_number")); mem.setMember_image(rs.getString("member_image")); memlist.add(mem); } }catch(SQLException e){ e.printStackTrace(); } return memlist; }

Page 16: lesson5 JSP

16

//Method ทใชเรยกแสดงผลชอทคลำยกนออกมำทงหมด public ArrayList<MembersBean> getAllMembersByNameLike(String name){ ArrayList<MembersBean> memlist = new ArrayList<MembersBean>(); MembersBean mem = new MembersBean(); String sql ="SELECT * FROM membersbook WHERE member_firstname LIKE'%"+name+"%' "; try{ dbc.createConnection(); stmt = dbc.getStatement(); rs = stmt.executeQuery(sql); while(rs.next()){ mem = new MembersBean(); mem.setMember_id(rs.getInt("member_id")); mem.setMember_username(rs.getString("member_username")); mem.setMember_password(rs.getString("member_password")); mem.setMember_firstname(rs.getString("member_firstname")); mem.setMember_lastname(rs.getString("member_lastname")); mem.setMember_sex(rs.getString("member_sex")); mem.setMember_address(rs.getString("member_address")); mem.setMember_county(rs.getString("member_county")); mem.setMember_email(rs.getString("member_email")); mem.setMember_number(rs.getString("member_number")); mem.setMember_image(rs.getString("member_image")); memlist.add(mem); } }catch(SQLException e){ e.printStackTrace(); } return memlist; }

Page 17: lesson5 JSP

17

Code Class SearchServlet

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding("UTF-8"); String trpe = request.getParameter("trpe"); String keyword = request.getParameter("keyword"); String page = "Search.jsp"; System.out.println("trpe : "+trpe); System.out.println("keyword : "+keyword); MemberDAO md = new MemberDAO(); if(trpe.equals("all")){

request.setAttribute("member", md.getAllMembers()); }else if(trpe.equals("name")){

request.setAttribute("member", md.getAllMembersByName(keyword)); }else {

request.setAttribute("member", md.getAllMembersByNameLike(keyword));

} }

Page 18: lesson5 JSP

18

ผลลพธของการรนโปรแกรมทงหมด

1. กำรเลอกแสดงขอมลทงหมดใน Table

2. กำรเลอกแสดงขอมลแบบใช Operators = (เทำกบ)

3. กำรเลอกขอมลโดยใช Like

Page 19: lesson5 JSP

19

อางอง

http://www.choosak.com/page-29/

http://suchada51122470136.blogspot.com/

http://www.sut.ac.th/ist/Courses/204204/Lecture/204204_47_09.pdf

http://www.cmm11.com/board/index.php?topic=2607.0

http://www.thaicreate.com/asp/asp-sql-command.html