lesson3 jsp
TRANSCRIPT
การเขยนโปรแกรมตดตอฐานขอมล
1
การเขยนโปรแกรมตดตอฐานขอมล
ภาษาทใชในการเขยนโปรแกรม .JSP
โปรแกรมทใชในการเขยนโปรแกรม Eclipse
1.โหลดโปรแกรม Eclipse
2.ตดตง AppServ 2.5.10 เพอใชในการเชอมตอ Java eclipse กบ MySQL
-ขนตอนการตดตง AppServ 2.5.10
เมอโหลดมาแลวกใหเปดไฟล Appserv ทโหลดมาจะไดดงรป
กดปม Next >
ตอมากจะแสดง License Agreement ของ AppServ 2.5.10
การเขยนโปรแกรมตดตอฐานขอมล
2
กดปม I Agree
จากนนกจะใหเลอกต าแหนงทจะตดตง เราสามารถเลอกไวทไหนกได แตผมขอเลอกตามทมนใหมา
การเขยนโปรแกรมตดตอฐานขอมล
3
กดปม Next >
จากนนจะแสดง Select Components
การเขยนโปรแกรมตดตอฐานขอมล
4
ใหเลอกเอาทงหมด แลวกดปม Next >
การเขยนโปรแกรมตดตอฐานขอมล
5
ตอมาจะเปนการก าหนดเกยวกบHTTPServer
ServerName : localhost Email: ใส E-mailของคณ Port: 80
จากนนกดปม Next >
การเขยนโปรแกรมตดตอฐานขอมล
6
ตอมาจะเปนการตงคาการใชงานฐานขอมล MySQL
เปนการก าหนดรหสผานใหกบฐานขอมล โดยทงสองชองจะตองตรงกน แลวกดปม Install
การเขยนโปรแกรมตดตอฐานขอมล
7
รอสกคร โปรแกรมก าลงท าการตดตง
การเขยนโปรแกรมตดตอฐานขอมล
8
จากนนถาขน Windows Security Alert ใหกดปม Allow access เลยนะครบ
ตอมาเลอกทงสองอน แลวกด Finish
การเขยนโปรแกรมตดตอฐานขอมล
9
กเสรจสนการตดตง appserv
จากนนใหมาเชควา web server ท างานไดหรอปาวนะครบ
การเขยนโปรแกรมตดตอฐานขอมล
10
โดยใหเปด browser ขนมา แลวพมพ localhost
3.ดาวนโหลดและตดตง Navicat เพอใชจดการฐานขอมล MySQL บน localhost
เวบส าหรบดาวนโหลด http://www.navicat.com/download/download.html
หลงจากทดาวนโหลดโปรแกรมมาแลวกดบเบลคลกไฟลทดาวนโหลด
การเขยนโปรแกรมตดตอฐานขอมล
11
กดปม Next
เลอก I accept the agreement แลวกดปม Next (ลองไมเลอกสพเขาไมใหตดตง)
การเขยนโปรแกรมตดตอฐานขอมล
12
Next ไปเลย
Next ไปเลย
การเขยนโปรแกรมตดตอฐานขอมล
13
Next >
กดปม Install
การเขยนโปรแกรมตดตอฐานขอมล
14
กด Finish จบขนตอนการลง โปรแกรม Navicat
4.โคดในสวนตางๆของโปรแกรม Java Eclipse ทใชเชอมตอกบฐานขอมล (MySQL)
4.1) สรางprojectขนมา 1 project ชอproject วา BookMark
4.2) สรางpackageขนมา 2 packageชอวา Package comment กบ Package controller
-ใน Package comment จะม java class อย ชอ class วา connect มโคดดงน
package comment;
import java.sql.DriverManager;
import java.sql.SQLException;
import java.sql.Statement;
import java.sql.Connection;
import java.util.logging.Level;
import java.util.logging.Logger;
การเขยนโปรแกรมตดตอฐานขอมล
15
public class connect {
public Connection conn =null;
public Statement stmt = null;
public Statement getStatement(){
return stmt;
}
public void createConnection() throws SQLException{
try{
Class.forName("com.mysql.jdbc.Driver");
conn = DriverManager.getConnection("jdbc:mysql://localhost/book","root","admin");
stmt= conn.createStatement();
System.out.println("Connect success.");
}catch(ClassNotFoundException ex) {
Logger.getLogger(connect.class.getName()).log(Level.SEVERE, null, ex);
System.out.println("Connect Fail.");
}
}
public void closeConnection(){
การเขยนโปรแกรมตดตอฐานขอมล
16
try{
conn.close();
}catch(SQLException ex){
Logger.getLogger(connect.class.getName()).log(Level.SEVERE, null, ex);
}
}
}
-ใน package controller จะมคลาสของ servlet ทตงชอวา loginservlet และมการ import มาจากclass connect ดวย มโคดของคลาส loginservlet ดงน
package com.controller;
import java.io.IOException;
import java.sql.SQLException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import comment.connect;
/*** Servlet implementation class LoginServlet */
การเขยนโปรแกรมตดตอฐานขอมล
17
@WebServlet("/LoginServlet")
public class LoginServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/*** Default constructor. */
public LoginServlet() {
// TODO Auto-generated constructor stub
}/** * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
}/** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
String username = request.getParameter("id");
String password = request.getParameter("password");
System.out.println("username="+username);
System.out.println("password="+password);
connect db = new connect();
try {
การเขยนโปรแกรมตดตอฐานขอมล
18
db.createConnection();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
}
4.3) และนจะเปนโคดของ Java.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1> สมครสมาชก</h1>
<center>
<form action="LoginServlet" method="post" onsubmit="return check()">
การเขยนโปรแกรมตดตอฐานขอมล
19
<table>
<tr>
<td align="right">User</td>
<td ><input type="text" name="id" ><br></td>
</tr>
<tr>
<td align="right">Password</td>
<td ><input type="password" name="password" ><br></td>
</tr>
<tr>
<td align="center" colspan="2">
<input type="submit" name="ok" value="ตกลง">
<br></td>
<!--
<tr>
<td align="right">ชอ </td>
<td><input type="text" name="Firstname" id="Firstname"> <br> </td>
</tr>
<tr>
<td align="right">สกล</td>
<td><input type="text" name="lastname" id="lastname"><br></td>
การเขยนโปรแกรมตดตอฐานขอมล
20
</tr>
<tr>
<td align="right">เพศ </td>
<td> <input type="radio" checked="checked" name="sex" value="ชาย">ชาย <input type="radio"
name="sex" value="หญง">หญง<br></td>
</tr>
<tr>
<td align="right">ชอบการตนประเภท</td>
<td>
<input type="checkbox" name="cartoon" value="ผจญภย">ผจญภย
<input type="checkbox" name="cartoon" value="โรแมนตก">โรแมนตก
<input type="checkbox" name="cartoon" value="กฬา">กฬา
<input type="checkbox" name="cartoon" value="ตลกขบขน">ตลก
<br></td>
</tr>
<tr>
<td align="right" >ทอย </td>
<td> <textarea name="Address" id="Address"></textarea><br></td>
</tr>
<tr>
<td align="right">จงหวด </td>
การเขยนโปรแกรมตดตอฐานขอมล
21
<td><select name="Province">
<option value="กรณาเลอกจงหวด">กรณาเลอกจงหวด</option>
<option value="เชยงใหม">เชยงใหม </option>
<option value="ขอนแกน">ขอนแกน</option>
<option value="ล าปาง">ล าปาง</option>
<option value="ล าพน">ล าพน</option>
<option value="เชยงราย">เชยงราย</option>
</select> <br> </td>
</tr>
<tr>
<td align="right">โทรศพท</td>
<td><input type="text" name="number" id="number"> <br> </td>
</tr>
<tr>
<td align="right">อเมล</td>
<td><input type="text" name="email" id="email"> <br> </td>
</tr>
<tr>
<td align="right">รปประจ าตว </td>
<td ><input type="file" id="image"> <br></td>
</tr>
<tr>
การเขยนโปรแกรมตดตอฐานขอมล
22
<td align="center" colspan="2">
<input type="submit" name="ok" value="ตกลง">
<input type="reset"name="delete" value="ลบ">
<br></td>
</tr>
-->
</table>
</form>
</center>
</body>
</html>
5.การสรางฐานขอมล MySQL ดวย Navicat
ขนตอนการด าเนนการ
1.สรางการเชอมตอฐานขอมล
การเขยนโปรแกรมตดตอฐานขอมล
23
หลงจากเปดโปรแกรม Navicat ขนมาแลว คลกท Connection โปรแกรมจะเปดหนาตาง Connection ขนมา ซงตองปอนรายละเอยดทจ าเปน ดงน Connection Name: ตงชอ Connection จะเปนอะไรกได ใหจ างายเขาไว Host name/IP address: ปลอยใหเปน localhost Port: ปลอยใหเปน 3306 User name: ปอน User name ทใชลอกอนเขาส MySQL คาดฟอลต จะเปน root Password: ปอนรหสผาน ทใชลอกอนเขาส MySQL ถาไมมรหสผาน ใหปลอยวางไว กดปม Test Connection เพอทดสอบการเชอมตอ ดกอนกได ถาโปรแกรมแจงวา Conection Successfully แสดงวาสามารถเชอมตอฐานขอมลไดแลว กใหคลกปม OK
2.สรางฐานขอมล
ดบเบลคลกทตว connection ทสรางขนมา เพอเชอมตอเขาใชงาน MySQL
คลกขวา ทตว connection
คลก New Database เพอสรางฐานขอมล โปรแกรมจะเปดไดอะลอกบอก Create New Database ขนมา
การเขยนโปรแกรมตดตอฐานขอมล
24
ซงมรายละเอยดทตองก าหนด ดงน
Enter database name: ตงชอฐานขอมล Character set: ก าหนดชดตวอกษร แนะน าเปน utf8–UTF-8 Unicode Collation: ก าหนด Collation แนะน าเปน utf8_general_ci
หลงจากก าหนดทกอยางเรยบรอย คลกปม OK คณสรางฐานขอมลใหม เรยบรอย
การสรางตารางใน Navicat
1.เปด Navicat ขนมา
คลกขวาท Tables => New Table
การเขยนโปรแกรมตดตอฐานขอมล
25
จะไดหนาตางน
การเขยนโปรแกรมตดตอฐานขอมล
26