본문 바로가기
Log/Project

Day35_차량정보 페이지 DB 연결_Create, Read, Update, Delete with ORM_DAO&VO(DTO)

by uxia 2023. 6. 25.

 

Day22에서 DAO, DTO 실습 내용을 정리했는데,

완전히 이해를 하지 못해서 다시 공부하며 정리한다.

HTML에서 데이터를 받아

jsp에서 bag을 통해 DTO에 데이터를 넣고

DTO에서 DAO로 데이터를 전달한다.

DAO는 DB와 연결을 해주고

SQL문을 통해 DB 서버로 데이터가 전송된다.

 

역으로 DB에서 데이터를 끌어올 때는

순서가 역행될 뿐 구조는 같다.

 


 

* DTO(Data Transfer Object, 데이터 전송 객체)

실무에서는 VO라고 많이 사용한다고 해서

프로젝트에서는 VO로 작성했다.

DB 작업에 필요한 데이터를 저장하는 객체로

테이블 하나 당 DTO Class가 1개씩 요구된다.

 

멤버변수를 생성해주고 Getter&Setter, toString()을 정의해주는 게

일반적인 DTO의 형태다.

 

 

* DAO(Data Access Object, 데이터 접근 객체)

DB와 연동하여 작업을 처리하는 객체로

사용자가 입력한 데이터를 DB로 전달하고

DB로부터 전달받은 데이터를 외부로 전달하는 역할을 한다.

 

DTO 객체에 저장되어있는 데이터를 출력할 때는

아래의 형태로 명령어를 입력한다.

"ID : " + dto.getId();

"VIN : " + dto.getVin();

"Model : " + dto.getModel();

 


브라우저가 실행되는 전체

적인 흐름을 보자면,

html파일에서 "carread.jsp"를 통해 jsp파일로 데이터를 전송하고

jsp 파일에서 데이터를 받아 VO(DTO)라는 가방에 데이터를 담아

DAO 파일로 전송한다.

DAO에서는 받은 데이터를 SQL문을 생성해 서버에 저장한다.

* 대개 row에 4개 이상의 데이터가 들어가면 가방(VO(DTO))에 담는다.

row(RDB) 하나 당 VO(Object) 한 개를 사용하는 1:1 관계로

Object와 RDB의 1:1 관계(Mapping)이라 해서 ORM 관계라고 부른다.

 


 

이 구조에 따라 차량정보 입력 페이지, 차량정보 수정 페이지,

차량정보 삭제 페이지, 차량정보 조회 페이지를 만들었다.

 

bag와 DAO&DTO(VO)를 이용해 코드를 작성했고

DB에 연결돼도록 했다.

 

bg img 출처 Ferrari Homepage
bg img 출처 Ferrari Homepage

 


 

Create

 

우선 차량 정보를 입력하는 첫 페이지를 만들었다.

 

car.html 파일

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Car Information</title>
  <style>
    body {
      background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.4)), url("img/ferrari_image.jpg");
      background-size: cover;
      background-position: center center;
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
    }
    
    .container {
      display: flex;
      height: 100vh;
    }
    
    .navbar {
      width: 200px;
      background-color: rgba(255, 255, 255, 0.7);
      padding: 20px;
      text-align: center;
      display: flex;
 	  flex-direction: column;
 	  justify-content: center;
 	  align-items: center;
    }
    
    .navbar button {
      display: block;
      width: 100%;
      background-color: transparent;
      border: none;
      color: #000;
      font-weight: bold;
      font-size: 16px;
      margin: 30px;
      cursor: pointer;
      outline: none;
    }
    
    
    .form-container {
      flex: 1;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    
    .form {
      background-color: rgba(255, 255, 255, 0.7);
      padding: 20px;
      border-radius: 10px;
      text-align: center;
    }
    
    .form input[type="text"] {
      width: 100%;
      padding: 10px;
      margin-bottom: 10px;
      border: 1px solid rgba(0, 0, 0, 0.2);
      border-radius: 5px;
      box-sizing: border-box;
    }
    
    .form button[type="submit"] {
      background-color: #BFFFFB;
      color: #000;
      border: none;
      border-radius: 5px;
      padding: 10px 20px;
      font-weight: bold;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <div class="container">
    <div class="navbar">
      <button onclick="location.href='carread.html'">차량 정보 조회</button>
      <button onclick="location.href='carupdate.html'">차량 정보 수정</button>
      <button onclick="location.href='cardelete.html'">차량 정보 삭제</button>
    </div>
    <div class="form-container">
      <div class="form">
        <h2>차량 정보 입력</h2>
        <form action="car.jsp" method="get">
          <input type="text" placeholder="VIN (Vehicle Identification Number)" required name="vin">
          <input type="text" placeholder="Model" required name="model">
          <input type="text" placeholder="Brand" required name="brand">
          <input type="text" placeholder="Year" required name="year">
          <button type="submit">제출</button>
        </form>
      </div>
    </div>
  </div>
</body>
</html>

 

car.jsp 파일

<%@page import="com.car.project.CarDAO"%>
<%@page import="com.car.project.CarVO"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.Connection"%>
<%@page import="java.sql.DriverManager"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

	<%
		String vin = request.getParameter("vin");
		String model = request.getParameter("model");
		String brand = request.getParameter("brand");
		String year = request.getParameter("year");
		
		// 1. 가방 생성
		CarVO bag = new CarVO();
		
		// 2. 받은 데이터 가방에 넣기 
		bag.setVin(vin);		
		bag.setModel(model);		
		bag.setBrand(brand);		
		bag.setYear(year);		
		
		// 3. DAO 생성 
		CarDAO dao = new CarDAO();
		
		// 4. Create 해달라고 요청과 함께 가방 전달 
		dao.create(bag);
		
	%>
	
<!DOCTYPE html>
<html>
<head>
<meta charset = "UTF-8">
<title>Insert title here</title>
</head>
<body bgcolor = "lightgray">
	<br> 요청에 대한 응답이 들어가는 부분 <br>
	<br> 서버로 전달된 VIN : 
	<%= vin %>
	<br> 서버로 전달된 Model : 
	<%= model %>
	<br> 서버로 전달된 Brand : 
	<%= brand %>
	<br> 서버로 전달된 Year : 
	<%= year %>
	<br>
</body>
</html>

 

CarVO.java 파일

VO(DTO) 코드는 이번 한 번만 작성해주면 된다.

package com.car.project;

public class CarVO {
	
	private String vin;
	private String model;
	private String brand;
	private String year;
	
	public String getVin() {
		return vin;
	}
	public void setVin(String vin) {
		this.vin = vin;
	}
	public String getModel() {
		return model;
	}
	public void setModel(String model) {
		this.model = model;
	}
	public String getBrand() {
		return brand;
	}
	public void setBrand(String brand) {
		this.brand = brand;
	}
	public String getYear() {
		return year;
	}
	public void setYear(String year) {
		this.year = year;
	}
	
	@Override
	public String toString() {
		return "CarVO [vin=" + vin + ", model=" + model + ", brand=" + brand + ", year=" + year + "]";
	}
	
}

 

CarDAO.java 파일

package com.car.project;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;

public class CarDAO {

	public void create(CarVO bag) {
		try {

			// 1. 드라이버 설정
			Class.forName("com.mysql.cj.jdbc.Driver");
			System.out.println("1. 드라이버 설정 성공");
			
			String url = "jdbc:mysql://localhost:3306/shop?serverTimezone=UTC";
			String user = "root";
			String password = "1234";
			// 2. DB연결 - url(ip + port + db명), id, pw
			
			Connection con = DriverManager.getConnection(url, user, password);	// Connection
			System.out.println("2. db연결 성공");

			// 3. sql문 생성 
			String sql = "insert into car values (?, ?, ?, ?)";
			PreparedStatement ps = con.prepareStatement(sql);
			ps.setString(1, bag.getVin());
			ps.setString(2, bag.getModel());
			ps.setString(3, bag.getBrand());
			ps.setString(4, bag.getYear());

			System.out.println("<br>3. SQL문 생성 성공");

			// 4. sql문 전송
			ps.executeUpdate();
			System.out.println("<br>4. SQL문 전송 성공<br>");

			ps.close();
			con.close();

		} catch (Exception e) {
			// TODO: handle exception
			e.printStackTrace();
		}	

	}
    
    public void read() {
    
    }
    
    public void update() {
    
    }
    
    public void delete() {
    
    }
    
}

 

출력 결과다.

input란에 데이터를 입력하면 요청 결과가 브라우저에 뜨고

DB에 연결되어 DB에서 입력된 데이터를 확인할 수 있다.

 


 

Delete

 

차량정보 삭제 페이지다.

 

cardelete.html 파일

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Car Information Update</title>
  <style>
    body {
      background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.4)), url("img/ferrari_image4.jpg");
      background-size: cover;
      background-position: center center;
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
    }
    
    .container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }
    
    .form {
      background-color: rgba(255, 255, 255, 0.7);
      padding: 20px;
      border-radius: 10px;
      text-align: center;
    }
    
    .form input[type="text"] {
      width: 100%;
      padding: 10px;
      margin-bottom: 10px;
      border: 1px solid rgba(0, 0, 0, 0.2); /* 검정색 옅은 테두리 추가 */
      border-radius: 5px;
      box-sizing: border-box;
    }
    
    .form button[type="submit"] {
      background-color: #BFFFFB;
      color: #000;
      border: none;
      border-radius: 5px;
      padding: 10px 20px;
      font-weight: bold;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <div class="container">
    <div class="form">
      <h2>차량 정보 삭제</h2>
      <form action="cardelete.jsp" method="get">
        <input type="text" placeholder="VIN (Vehicle Identification Number)" required name="vin">
        <button type="submit">삭제</button>
      </form>
    </div>
  </div>
</body>
</html>

 

cardelete.jsp 파일

<%@page import="com.car.project.CarDAO"%>
<%@page import="com.car.project.CarVO"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.Connection"%>
<%@page import="java.sql.DriverManager"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

	<jsp:useBean id="bag" class="com.car.project.CarVO"></jsp:useBean>
	<jsp:setProperty property="vin" name="bag"/> <!-- property : "id" -> "vin" -->
	
	<%
	
	CarDAO dao = new CarDAO();
	int result = dao.delete(bag);
	if(result == 1) {
		out.print("<h3>차량정보 삭제 완료</h3>");
	} else {
		out.print("<h3>차량정보 삭제 실패</h3>");
	}
	
	%>

 

CarDAO.java 파일

여기는 앞전에 Create 부분에서 생성한 데 이어

delete 부분에 추가해주고

Cmd + Shift + O 단축키로 import를 생성해주면 된다.

package com.car.project;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.SQLException;

public class CarDAO {

	public void create(CarVO bag) {
		try {

			// 1. 드라이버 설정
			Class.forName("com.mysql.cj.jdbc.Driver");
			System.out.println("1. 드라이버 설정 성공");
			
			String url = "jdbc:mysql://localhost:3306/shop?serverTimezone=UTC";
			String user = "root";
			String password = "1234";
			// 2. DB연결 - url(ip + port + db명), id, pw
			
			Connection con = DriverManager.getConnection(url, user, password);	// Connection
			System.out.println("2. db연결 성공");

			// 3. sql문 생성 
			String sql = "insert into car values (?, ?, ?, ?)";
			PreparedStatement ps = con.prepareStatement(sql);
			ps.setString(1, bag.getVin());
			ps.setString(2, bag.getModel());
			ps.setString(3, bag.getBrand());
			ps.setString(4, bag.getYear());

			System.out.println("<br>3. SQL문 생성 성공");

			// 4. sql문 전송
			ps.executeUpdate();
			System.out.println("<br>4. SQL문 전송 성공<br>");

			ps.close();
			con.close();

		} catch (Exception e) {
			// TODO: handle exception
			e.printStackTrace();
		}	

	}
	
	public void read() {
		
	}
	
	public void update() {
		
	}
	
	public int delete(CarVO bag) {
		int result = 0;
		try {
			
			// 1. 드라이버 설정 
			Class.forName("com.mysql.cj.jdbc.Driver");
			System.out.println("1. 드라이버 설정 성공");
			String url = "jdbc:mysql://localhost:3306/shop?serverTimezone=UTC";
			String user = "root";
			String password = "1234";
			
			// 2. DB 연결 
			Connection con = DriverManager.getConnection(url, user, password);
			System.out.println("<br>2. DB연결 성공");
			
			// 3. SQL문 생성
			String sql = "delete from car where vin = ?";
			PreparedStatement ps = con.prepareStatement(sql);
			ps.setString(1, bag.getVin());
			
			System.out.println("<br>3. SQL문 생성 성공");
			
			// 4. SQL문 전송 
			result = ps.executeUpdate();
			System.out.println("<br>4. SQL문 전송 성공");
			
			ps.close();
			con.close();
		
		} catch (ClassNotFoundException e) {
			// TODO: handle exception
			e.printStackTrace();
		} catch (SQLException e) {
			// TODO: handle exception
			e.printStackTrace();
		}
		
		return result;
		
	}
	
}

 

출력 결과다.

차량의 VIN을 입력하면 브라우저에 삭제 완료/실패 문구가 뜨면서

해당 차량 데이터가 DB에서 삭제된다.

 


Read

 

차량의 VIN을 입력해서 입력했던 차량정보를 조회하는 페이지다.

 

carread.html 파일

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Car Information Update</title>
  <style>
    body {
      background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.4)), url("img/ferrari_image3.jpg");
      background-size: cover;
      background-position: center center;
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
    }
    
    .container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }
    
    .form {
      background-color: rgba(255, 255, 255, 0.7);
      padding: 20px;
      border-radius: 10px;
      text-align: center;
    }
    
    .form input[type="text"] {
      width: 100%;
      padding: 10px;
      margin-bottom: 10px;
      border: 1px solid rgba(0, 0, 0, 0.2); /* 검정색 옅은 테두리 추가 */
      border-radius: 5px;
      box-sizing: border-box;
    }
    
    .form button[type="submit"] {
      background-color: #BFFFFB;
      color: #000;
      border: none;
      border-radius: 5px;
      padding: 10px 20px;
      font-weight: bold;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <div class="container">
    <div class="form">
      <h2>차량 정보 조회</h2>
      <form action="carread.jsp" method="get">
        <input type="text" placeholder="VIN (Vehicle Identification Number)" required name="vin" value="1234">
        <button type="submit">조회</button>
      </form>
    </div>
  </div>
</body>
</html>

 

carread.jsp 파일

<%@page import="com.car.project.CarDAO"%>
<%@page import="com.car.project.CarVO"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.Connection"%>
<%@page import="java.sql.DriverManager"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

	<jsp:useBean id="bag" class="com.car.project.CarVO"></jsp:useBean>
	<jsp:setProperty property="vin" name="bag"/> <!-- property : "id" -> "vin" -->

    <% 
        // CarVO bag = new CarVO();
    	// bag.setVin(request.getParameter("vin"));
    	
    	CarDAO dao = new CarDAO();
    	CarVO bag2 = dao.read(bag);
        
    %>

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Car Information Update</title>
  <style>
    body {
      background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.4)), url("img/ferrari_image2.jpg");
      background-size: cover;
      background-position: center center;
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
    }
    
    .container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }
    
    .form {
      background-color: rgba(255, 255, 255, 0.9);
      padding: 20px;
      border-radius: 10px;
      text-align: center;
    }
    
    .form input[type="text"] {
      width: 100%;
      padding: 10px;
      margin-bottom: 10px;
      border: 1px solid rgba(0, 0, 0, 0.2); /* 변경: 검정색 옅은 테두리 추가 */
      border-radius: 5px;
      box-sizing: border-box;
    }
    
    .form button[type="submit"] {
      background-color: #BFFFFB;
      color: #000;
      border: none;
      border-radius: 5px;
      padding: 10px 20px;
      font-weight: bold;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <div class="container">
    <div class="form">
      <h2>차량 정보 조회</h2>
      <form action="carupdate.jsp" method="get">
      	VIN : <%= bag2.getVin() %><br>
      	Model : <%= bag2.getModel() %><br>
      	Brand : <%= bag2.getBrand() %><br>
      	Year : <%= bag2.getYear() %><br>
      </form>
    </div>
  </div>
</body>
</html>

 

CarDAO.java 파일

마찬가지로 기존 코드에 추가만 해주고 import해준다.

package com.car.project;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;

public class CarDAO {

	public void create(CarVO bag) {
		try {

			// 1. 드라이버 설정
			Class.forName("com.mysql.cj.jdbc.Driver");
			System.out.println("1. 드라이버 설정 성공");
			
			String url = "jdbc:mysql://localhost:3306/shop?serverTimezone=UTC";
			String user = "root";
			String password = "1234";
			// 2. DB연결 - url(ip + port + db명), id, pw
			
			Connection con = DriverManager.getConnection(url, user, password);	// Connection
			System.out.println("2. db연결 성공");

			// 3. sql문 생성 
			String sql = "insert into car values (?, ?, ?, ?)";
			PreparedStatement ps = con.prepareStatement(sql);
			ps.setString(1, bag.getVin());
			ps.setString(2, bag.getModel());
			ps.setString(3, bag.getBrand());
			ps.setString(4, bag.getYear());

			System.out.println("<br>3. SQL문 생성 성공");

			// 4. sql문 전송
			ps.executeUpdate();
			System.out.println("<br>4. SQL문 전송 성공<br>");

			ps.close();
			con.close();

		} catch (Exception e) {
			// TODO: handle exception
			e.printStackTrace();
		}	

	}
	
	public CarVO read(CarVO bag) {
		ResultSet table = null;
		CarVO bag2 = null;
		try {
			// 1. 드라이버 설정 
			Class.forName("com.mysql.cj.jdbc.Driver");
			System.out.println("1. 드라이버 설정 성공");
			String url = "jdbc:mysql://localhost:3306/shop?serverTimezone=UTC";
			String user = "root";
			String password = "1234";
			
			Connection con = DriverManager.getConnection(url, user, password);
			System.out.println("<br>2. DB 연결 성공");
			
			// 3. SQL문 생성
			String sql = "select * from car where vin = ?";
			PreparedStatement ps = con.prepareStatement(sql);
			ps.setString(1, bag.getVin());
			
			System.out.println("<br>3. SQL문 생성 성공");
			
			// 4. SQL문 전송
			table = ps.executeQuery();
			System.out.println("<br>4. SQL문 전송 성공<br>");
			
			// 테이블에서 데이터를 꺼내 가방을 만들어 넣음 
			if(table.next()) {
				bag2 = new CarVO();
				bag2.setVin(table.getString("vin"));
				bag2.setModel(table.getString("model"));
				bag2.setBrand(table.getString("brand"));
				bag2.setYear(table.getString("year"));
			} else {
				System.out.println("해당 차량 정보를 찾을 수 없음");
			}
			
			ps.close();
			con.close();
			
		} catch (ClassNotFoundException e) {
			e.printStackTrace();
		} catch (SQLException e) {
			// TODO: handle exception
			e.printStackTrace();
		} catch (Exception e) {
			e.printStackTrace();
		}
		
		System.out.println(bag2);
		return bag2;
		
	}
	
	public void update() {
		
	}
	
	public int delete(CarVO bag) {
		int result = 0;
		try {
			
			// 1. 드라이버 설정 
			Class.forName("com.mysql.cj.jdbc.Driver");
			System.out.println("1. 드라이버 설정 성공");
			String url = "jdbc:mysql://localhost:3306/shop?serverTimezone=UTC";
			String user = "root";
			String password = "1234";
			
			// 2. DB 연결 
			Connection con = DriverManager.getConnection(url, user, password);
			System.out.println("<br>2. DB연결 성공");
			
			// 3. SQL문 생성
			String sql = "delete from car where vin = ?";
			PreparedStatement ps = con.prepareStatement(sql);
			ps.setString(1, bag.getVin());
			
			System.out.println("<br>3. SQL문 생성 성공");
			
			// 4. SQL문 전송 
			result = ps.executeUpdate();
			System.out.println("<br>4. SQL문 전송 성공");
			
			ps.close();
			con.close();
		
		} catch (ClassNotFoundException e) {
			// TODO: handle exception
			e.printStackTrace();
		} catch (SQLException e) {
			// TODO: handle exception
			e.printStackTrace();
		}
		
		return result;
		
	}
	
}

Read 에서는 ResultSet을 사용했는데,

ResultSet은 Table을 의미하는 자바 용어로,

ResultSet은 DAO에서만 사용하는 용어라 밖으로 나갈 수가 없다.

 

 

결과창

 


 

Update

 

carupdate.html 파일

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Car Information Update</title>
  <style>
    body {
      background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.4)), url("img/ferrari_image2.jpg");
      background-size: cover;
      background-position: center center;
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
    }
    
    .container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }
    
    .form {
      background-color: rgba(255, 255, 255, 0.7);
      padding: 20px;
      border-radius: 10px;
      text-align: center;
    }
    
    .form button[type="button"] {
      background-color: #BFFFFB;
      color: #000;
      border: none;
      border-radius: 5px;
      padding: 10px 20px;
      font-weight: bold;
      cursor: pointer;
      margin-bottom: 10px;
    }
    
    .form input[type="text"] {
      width: 100%;
      padding: 10px;
      margin-bottom: 10px;
      border: 1px solid rgba(0, 0, 0, 0.2); /* 변경: 검정색 옅은 테두리 추가 */
      border-radius: 5px;
      box-sizing: border-box;
    }
    
    .form button[type="submit"] {
      background-color: #BFFFFB;
      color: #000;
      border: none;
      border-radius: 5px;
      padding: 10px 20px;
      font-weight: bold;
      cursor: pointer;
    }
    
  </style>
</head>
<body>
  <div class="container">
    <div class="form">
      <h2>차량 정보 수정</h2>
      <form action="carupdate.jsp" method="post">
        <input type="text" placeholder="VIN (Vehicle Identification Number)" required name="vin">
        <button type="button" onclick="fetchCarData()">VIN 확인</button>
        <input type="text" placeholder="New Model" id="model" required name="model">
        <input type="text" placeholder="New Brand" id="brand" required name="brand">
        <input type="text" placeholder="New Year" id="year" required name="year">
        <button type="submit">수정</button>
      </form>
    </div>
  </div>
  <script>
  	function fetchCarData() {
  		// VIN 값을 가져옴
  		var vin = document.getElementsByName("vin")[0].value;
  		
  		// AJAX 요청을 통해 서버로 VIN 값을 전송하고 데이터를 받아옴 
  		// 이후 받아온 데이터를 각각의 입력 필드에 설정 
  		var modelInput = document.getElementById("model");
  		var brandInput = document.getElementById("brand");
  		var yearInput = document.getElementById("year");
  		
  		// Mock 데이터 설정 
  		var MockData = {
  				model : "New Model",
  				brnad : "New Brand",
  				year : "New Year"
  		};
  		
  		modelInpt.value = mockData.model;
  		brandInput.value = mockData.brnad;
  		yearInput.value = mockYear.year;
  		
  	}
  	
  </script>
</body>
</html>

 

carupdate.jsp 파일

<%@page import="com.car.project.CarDAO"%>
<%@page import="com.car.project.CarVO"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.Connection"%>
<%@page import="java.sql.DriverManager"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
    <jsp:useBean id = "bag" class = "com.car.project.CarVO" scope = "request"></jsp:useBean>
    <jsp:setProperty property = "vin" name = "bag"/>
    
    <% 
    
    request.setCharacterEncoding("UTF-8");
    
    String vin = request.getParameter("vin");
    String model = request.getParameter("model");
    String brand = request.getParameter("brand");
    String year = request.getParameter("year");
    
    CarVO car = new CarVO();
    car.setVin(vin);
    car.setModel(model);
    car.setBrand(brand);
    car.setYear(year);
    
    CarDAO dao = new CarDAO();
    dao.update(car);
    
    %>
    
    <!DOCTYPE html>
    <html>
    <head>
    	<meta charset = "UTF-8">
    	<title>차량정보 수정</title>
    </head>
    <body>
    	<h1>차량정보 수정</h1>
    	<p>차량정보가 성공적으로 수정되었습니다.</p>
    	<p>VIN : <%= car.getVin() %></p>
    	<p>Model : <%= car.getModel() %></p>
    	<p>Brand : <%= car.getBrand() %></p>
    	<p>Year : <%= car.getYear() %></p>
    </body>
    </html>

 

CarDAO.java 파일

마찬가지로 기존의 파일에서 update부분만

추가해주고 import해주면 된다.

package com.car.project;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;

import com.multi.mvc006.CarVO;

public class CarDAO {

	public void create(CarVO bag) {
		try {

			// 1. 드라이버 설정
			Class.forName("com.mysql.cj.jdbc.Driver");
			System.out.println("1. 드라이버 설정 성공");
			
			String url = "jdbc:mysql://localhost:3306/shop?serverTimezone=UTC";
			String user = "root";
			String password = "1234";
			// 2. DB연결 - url(ip + port + db명), id, pw
			
			Connection con = DriverManager.getConnection(url, user, password);	// Connection
			System.out.println("2. db연결 성공");

			// 3. sql문 생성 
			String sql = "insert into car values (?, ?, ?, ?)";
			PreparedStatement ps = con.prepareStatement(sql);
			ps.setString(1, bag.getVin());
			ps.setString(2, bag.getModel());
			ps.setString(3, bag.getBrand());
			ps.setString(4, bag.getYear());

			System.out.println("<br>3. SQL문 생성 성공");

			// 4. sql문 전송
			ps.executeUpdate();
			System.out.println("<br>4. SQL문 전송 성공<br>");

			ps.close();
			con.close();

		} catch (Exception e) {
			// TODO: handle exception
			e.printStackTrace();
		}	

	}
	
	public CarVO read(CarVO bag) {
		ResultSet table = null;
		CarVO bag2 = null;
		try {
			// 1. 드라이버 설정 
			Class.forName("com.mysql.cj.jdbc.Driver");
			System.out.println("1. 드라이버 설정 성공");
			String url = "jdbc:mysql://localhost:3306/shop?serverTimezone=UTC";
			String user = "root";
			String password = "1234";
			
			Connection con = DriverManager.getConnection(url, user, password);
			System.out.println("<br>2. DB 연결 성공");
			
			// 3. SQL문 생성
			String sql = "select * from car where vin = ?";
			PreparedStatement ps = con.prepareStatement(sql);
			ps.setString(1, bag.getVin());
			
			System.out.println("<br>3. SQL문 생성 성공");
			
			// 4. SQL문 전송
			table = ps.executeQuery();
			System.out.println("<br>4. SQL문 전송 성공<br>");
			
			// 테이블에서 데이터를 꺼내 가방을 만들어 넣음 
			if(table.next()) {
				bag2 = new CarVO();
				bag2.setVin(table.getString("vin"));
				bag2.setModel(table.getString("model"));
				bag2.setBrand(table.getString("brand"));
				bag2.setYear(table.getString("year"));
			} else {
				System.out.println("해당 차량 정보를 찾을 수 없음");
			}
			
			ps.close();
			con.close();
			
		} catch (ClassNotFoundException e) {
			e.printStackTrace();
		} catch (SQLException e) {
			// TODO: handle exception
			e.printStackTrace();
		} catch (Exception e) {
			e.printStackTrace();
		}
		
		System.out.println(bag2);
		return bag2;
		
	}
	
	public void update(CarVO bag) {
		try {
			// 드라이버 설정 
			Class.forName("com.mysql.cj.jdbc.Driver");
			System.out.println("1. 드라이버 설정 성공");
			
			String url = "jdbc:mysql://localhost:3306/shop?serverTimezone=UTC";
			String user = "root";
			String password = "1234";
			
			// DB 연결 
			Connection con = DriverManager.getConnection(url, user, password);
			System.out.println("2. DB연결 성공");
				
			// SQL문 생성 
			String sql = "update car set model = ?, brand = ?, year = ? where vin = ?";
			PreparedStatement ps = con.prepareStatement(sql);
			// System.out.println(bag.getModel());
			ps.setString(1, bag.getModel());
			ps.setString(2, bag.getBrand());
			ps.setString(3, bag.getYear());
			ps.setString(4, bag.getVin());
			
			System.out.println("<br>3. SQL문 생성 성공");
			
			// SQL문 전송 
			ps.executeUpdate();
			System.out.println("<br>4. SQL문 전송 성공<br>");
			
			ps.close();
			con.close();
			
		} catch (Exception e) {
			e.printStackTrace();
		}
				
	}
	
	public int delete(CarVO bag) {
		int result = 0;
		try {
			
			// 1. 드라이버 설정 
			Class.forName("com.mysql.cj.jdbc.Driver");
			System.out.println("1. 드라이버 설정 성공");
			String url = "jdbc:mysql://localhost:3306/shop?serverTimezone=UTC";
			String user = "root";
			String password = "1234";
			
			// 2. DB 연결 
			Connection con = DriverManager.getConnection(url, user, password);
			System.out.println("<br>2. DB연결 성공");
			
			// 3. SQL문 생성
			String sql = "delete from car where vin = ?";
			PreparedStatement ps = con.prepareStatement(sql);
			ps.setString(1, bag.getVin());
			
			System.out.println("<br>3. SQL문 생성 성공");
			
			// 4. SQL문 전송 
			result = ps.executeUpdate();
			System.out.println("<br>4. SQL문 전송 성공");
			
			ps.close();
			con.close();
		
		} catch (ClassNotFoundException e) {
			// TODO: handle exception
			e.printStackTrace();
		} catch (SQLException e) {
			// TODO: handle exception
			e.printStackTrace();
		}
		
		return result;
		
	}
	
}

 

 

 

 

결과창이다.

 

굳👍