1. 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. 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. 3
Select query
ใช้ในกำรดึงข้อมูลในฐำนข้อมูล จะมีกำรค้นหำรำยกำรจำกตำรำงในฐำนข้อมูล ตั้งแต่หนึ่ง
ตำรำงขึ้นไป ตำมเงื่อนไขที่สั่ง ผลลัพธ์ที่ได้จะเป็นเซตของข้อมูลที่สำมำรถสร้ำง เป็นตำรำงใหม่
หรือใช้แสดงออกมำทำงจอภำพเท่ำนั้น โดยมีรูปแบบดังนี้
Select (รำยละเอียดที่เลือก)
Form (ตำรำงแหล่งที่มำ)
Where (กำหนดเงื่อนไขฐำนข้อมูลที่เลือก)
Group by (ชื่อคอลัมน์)
คาสั่งค้นหาข้อมูล (Query Statement)
คำสั่ง SELECT เป็นคำสั่งกำรเรียกดูข้อมูล หรือ ค้นหำข้อมูล ตำมเงื่อนไขที่ระบุ เนื่องจำก
คำสั่ง SELECT เป็นคำสั่งที่มีรูปแบบกำรใช้งำนที่ง่ำยเพื่อช่วยในกำรค้นหำข้อมูลที่ซับซ้อน
ดังมีรูปแบบดังนี้
SELECT <ชื่อคอลัมน์ที่ตองกำรดูขอมูล>
FROM <ชื่อตำรำง>
WHERE <เงื่อนไขตำมที่ระบุ>
SELECT --- เป็นคำสั่งให้ทำกำรเรียกดูขอมูลในคอลัมน์ที่ระบุ ซึ่งอำจจะมำกกว่ำหนึ่งก็ได้และถ้ำมี
มำกกว่ำหนึ่งคอลัมน์ต้องคั่นด้วย คอมมำ (,) และนอกจำกนี้ยังสำมำรถใช้เครื่องหมำย
ดอกจัน (*) เพื่อแสดงถึงกำรขอดูข้อมูลทั้งหมดไดอีกด้วย
FROM --- เป็นส่วนประกอบของคำสั่งที่บอกถึงตำรำงที่ตองกำรดูซึ่งอำจจะมีมำกกวำหนึ่งตำรำงก็
ได้ที่จะถูกเรียกใช้จำกคำสั่ง SELECT
WHERE--- เป็นสวนประกอบของคำสั่ง ที่ใช้บ่งบอกเงื่อนไขที่จะใช้ในกำรค้นหำข้อมูล ขึ้นมำจำก
ตำรำงใดๆ ที่อยู่หลัง FROM นี้

4. 4
รูปแบบการใช้งาน คาสั่งการค้นหา/แสดงข้อมูล
คำสั่ง SQL SELECT สำมำรถเรียกได้ทั้งตำรำง หรือว่ำ สำมำรถระบุฟิลด์ที่ต้องกำรเรียกดู
ข้อมูลได้
ยกตัวอย่างเช่น
กำรเลือกข้อมูลทั้งหมดของ Table
คำสั่ง SQL WHERE เป็นคำสั่งที่ใช้สำหรับกำรระบุเงื่อนไขกำรเลือกข้อมูลในตำรำง
(Table) คำสั่ง SQL WHERE สำมำรถระบุเงื่อนไขในกำรเลือกข้อมูลได้ 1 เงื่อนไข หรือ มำกกว่ำ 1
เงื่อนไข
ยกตัวอย่างเช่น
1. กำรเลือกข้อมูลโดยใช้ Operators = (เท่ำกับ)
2. กำรเลือกข้อมูลโดยใช้ คำสั่ง LIKE

5. 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. 6
วิธีใช้งาน คาสั่งการค้นหา/แสดงข้อมูล
การสร้างหน้า JSP
1. คลิกขวำที่ WebContent --> New --> JSP file แล้วตั้งชื่อว่ำ Search.jsp
2. เขียนคำสั่งหน้ำ Search.jsp ให้แสดงผลออกมำดังหน้ำ Web Pageโดยมีตัวเลือกให้ผู้ใช้
สำมำรถเลือกได้ 3 กรณี คือ ค้นหำจำกทั้งหมด , ค้นหำจำกชื่อ และค้นหำจำกชื่อที่ใกล้เคียง

7. 7
การสร้างหน้า SearchServlet.java
1. คลิกขวำที่ Package com.controller --> New --> Servlet แล้วตั้งชื่อว่ำ SearchServlet
2. เขียนโค้ดหน้ำ SearchServlet. java ซึ่งเขียนใน Method doPost

8. 8
การสร้างหน้า MemberDAO.java
3. เขียนโค้ดหน้ำ MemberDAO.java
การเขียนโค้ดโดยเลือกจากข้อมูลทั้งหมดของ Table
ผลลัพธ์ของการรันโปรแกรม

9. 9
การเขียนโค้ดโดยเลือกจากข้อมูลบางฟิลด์โดยใช้ Operators = (เท่ากับ)
ผลลัพธ์ของการรันโปรแกรม

10. 10
การเขียนโค้ดโดยเลือกจากข้อมูลบางฟิลด์โดยใช้ คาสั่ง LIKE
ผลลัพธ์ของการรันโปรแกรม

11. 11
การเขียนโค้ดหน้า SearchServlet..java
4. เขียนโค้ดหน้ำ SearchServlet..java เพื่อเรียกใช้ Class MemberDAO และกำรเขียน
เงื่อนไขในกำรเลือกใช้ Combo box
การเขียนโค้ดหน้า Search.jsp
5. เขียนโค้ดหน้า Search.jsp เพื่อให้แสดงข้อมูลจากผลการค้นหา

12. 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. 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. 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. 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. 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. 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. 18
ผลลัพธ์ของการรันโปรแกรมทั้งหมด
1. กำรเลือกแสดงข้อมูลทั้งหมดใน Table
2. กำรเลือกแสดงข้อมูลแบบใช้ Operators = (เท่ำกับ)
3. กำรเลือกข้อมูลโดยใช้ Like

19. 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