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 บรำวเซอรกจะสำมำรถแสดงผลได

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 ใชส ำหรบลบขอมลออกไป

3

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

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

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

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

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

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

FROM <ชอตำรำง>

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

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

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

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

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

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

4

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

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

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

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

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

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

6

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

การสรางหนา JSP

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

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

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

7

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

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

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

8

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

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

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

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

9

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

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

10

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

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

11

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

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

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

5. เขยนโคดหนา Search.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>

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>

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; }

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; }

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; }

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));

} }

18

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

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

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

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

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