07. 상품 이미지 등록하기
2020. 9. 29. 10:41
728x90
이미지 출력
Product.java
package DTO;
import java.io.Serializable;
public class Product implements Serializable{
public Product(String productId, String pname, Integer unitPrice) {
super();
this.productId = productId;
this.pname = pname;
this.unitPrice = unitPrice;
}
public Product() {
super();
// TODO Auto-generated constructor stub
}
private static final long serialVersionUID = -4274700572038677000L;
private String productId; //상품 아이디
private String pname; //상품명
private Integer unitPrice; //상품 가격
private String description; //상품 설명
private String manufacturer; //제조사
private String category; //분류
private long unitsInStock; //재고 수
private String condition; //신상품 or 중고품 or 재생품
private String filename; //이미지 파일명
public String getProductId() {
return productId;
}
public void setProductId(String productId) {
this.productId = productId;
}
public String getPname() {
return pname;
}
public void setPname(String pname) {
this.pname = pname;
}
public Integer getUnitPrice() {
return unitPrice;
}
public void setUnitPrice(Integer unitPrice) {
this.unitPrice = unitPrice;
}
public String getDescription() {
return description;
}
public void setDescription(String description) {
this.description = description;
}
public String getManufacturer() {
return manufacturer;
}
public void setManufacturer(String manufacturer) {
this.manufacturer = manufacturer;
}
public String getCategory() {
return category;
}
public void setCategory(String category) {
this.category = category;
}
public long getUnitsInStock() {
return unitsInStock;
}
public void setUnitsInStock(long unitsInStock) {
this.unitsInStock = unitsInStock;
}
public String getCondition() {
return condition;
}
public void setCondition(String condition) {
this.condition = condition;
}
public String getFilename() {
return filename;
}
public void setFilename(String filename) {
this.filename = filename;
}
}
| - filename 변수 String형으로 추가 - getter/setter 메소드 추가 |
ProductRepository.java
package DAO;
import java.util.ArrayList;
import DTO.Product;
public class ProductRepository {
private ArrayList<Product> listOfProducts = new ArrayList<Product>();
private static ProductRepository instance = new ProductRepository();
public static ProductRepository getInstance() {
return instance;
}
public ProductRepository() {
Product phone = new Product("P1234", "iPhone 6s", 800000);
phone.setDescription("4.17-inch, 1334X750 Renina HD display, 8-megapixel iSight Camera");
phone.setCategory("Smart Phone");
phone.setManufacturer("Apple");
phone.setUnitsInStock(1000);
phone.setCondition("New");
phone.setFilename("P1234.png");
Product notebook = new Product("P1235", "LG PC 그램", 1500000);
notebook.setDescription("13.3-inch, IPS LED display, 5rd Generation Intel Core processors");
notebook.setCategory("NoteBook");
notebook.setManufacturer("LG");
notebook.setUnitsInStock(1000);
notebook.setCondition("Refurbished");
notebook.setFilename("P1235.png");
Product tablet = new Product("P1236", "Galaxy Tab S", 900000);
tablet.setDescription("212.8*125.6*6.6mm, Super AMOLED display, Octa-Core Processor");
tablet.setCategory("Tablet");
tablet.setManufacturer("Samsung");
tablet.setUnitsInStock(1000);
tablet.setCondition("Old");
tablet.setFilename("P1236.png");
listOfProducts.add(phone);
listOfProducts.add(notebook);
listOfProducts.add(tablet);
}
public ArrayList<Product> getAllProducts(){
return listOfProducts;
}
public Product getProductById(String productId) {
Product productById = null;
for(int i=0; i<listOfProducts.size(); i++) {
Product product = listOfProducts.get(i);
if(product!=null && product.getProductId()!= null && product.getProductId().equals(productId)) {
productById = product;
break;
}
}
return productById;
}
public void addProduct(Product product) {
listOfProducts.add(product);
}
}
| - 이미지 파일 추가 |
Products.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="java.util.ArrayList" %>
<%@ page import="DTO.Product" %>
<%@ page import="DAO.ProductRepository" %>
<jsp:useBean id="productDAO" class="DAO.ProductRepository" scope="session" />
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>상품 목록</title>
<link rel="stylesheet" href="./resources/css/bootstrap.min.css">
</head>
<body>
<%@ include file="Menu.jsp" %>
<div class="jumbotron">
<div class="container">
<h1 class="display-3">
상품 목록
</h1>
</div>
</div>
<%
ProductRepository dao = ProductRepository.getInstance();
ArrayList<Product> listOfProducts = productDAO.getAllProducts();
%>
<div class="container">
<div class="row" align="center">
<%
for(int i=0; i<listOfProducts.size(); i++){
Product product = listOfProducts.get(i);
%>
<div class="col-md-4">
<img src="./resources/images/<%=product.getFilename() %>"
style="width:100%">
<h3><%=product.getPname() %></h3>
<p><%=product.getDescription() %>
<p><%=product.getUnitPrice() %>원
<p><a href="./Product.jsp?id=<%=product.getProductId() %>"
class="btn btn-secondary" role="button">
<!-- » = 특수문자 >> -->
상세 정보 »
</a>
</div>
<%
}
%>
</div>
<!-- 구분선 -->
<hr>
</div>
<%@ include file="Footer.jsp" %>
</body>
</html>| - 이미지 경로 수정 - 이미지 출력 |
Product.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="DTO.Product" %>
<%@ page import="DAO.ProductRepository" %>
<jsp:useBean id="productDAO" class="DAO.ProductRepository" scope="session" />
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>상품 상세 정보</title>
<link rel="stylesheet" href="./resources/css/bootstrap.min.css">
</head>
<body>
<%@ include file="Menu.jsp" %>
<div class="jumbotron">
<div class="container">
<h1 class="display-3">
상품 정보
</h1>
</div>
</div>
<%
String id = request.getParameter("id");
ProductRepository dao = ProductRepository.getInstance();
Product product = productDAO.getProductById(id);
%>
<div class="container">
<div class="row">
<div class="col-md-5">
<img src="./resources/css/bootstrap.min,css"
style="width:100%" />
</div>
<div class="col-md-6">
<h3><%=product.getPname() %></h3>
<p><%=product.getDescription() %>
<p><b>상품 코드: </b>
<span class="bagde badge-danger">
<%=product.getProductId() %>
</span>
<p><b>제조사: </b><%=product.getManufacturer() %>
<p><b>분류: </b><%=product.getCategory() %>
<p><b>재고: </b><%=product.getUnitsInStock() %>
<h4><%=product.getUnitPrice() %>원</h4>
<p><a href="#" class="btn btn-info">상품 주문 »</a>
<a href="./Products.jsp" class="btn btn-secondary">상품 목록 »</a>
</div>
</div>
<hr>
</div>
<%@ include file="Footer.jsp" %>
</body>
</html>| - 이미지 경로 수정 - 이미지 출력 |
이미지 등록
Products.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="java.util.ArrayList" %>
<%@ page import="DTO.Product" %>
<%@ page import="DAO.ProductRepository" %>
<jsp:useBean id="productDAO" class="DAO.ProductRepository" scope="session" />
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>상품 목록</title>
<link rel="stylesheet" href="./resources/css/bootstrap.min.css">
</head>
<body>
<%@ include file="Menu.jsp" %>
<div class="jumbotron">
<div class="container">
<h1 class="display-3">
상품 목록
</h1>
</div>
</div>
<%
ProductRepository dao = ProductRepository.getInstance();
ArrayList<Product> listOfProducts = productDAO.getAllProducts();
%>
<div class="container">
<div class="row" align="center">
<%
for(int i=0; i<listOfProducts.size(); i++){
Product product = listOfProducts.get(i);
%>
<div class="col-md-4">
<img src="./upload/<%=product.getFilename() %>"
style="width:100%">
<h3><%=product.getPname() %></h3>
<p><%=product.getDescription() %>
<p><%=product.getUnitPrice() %>원
<p><a href="./Product.jsp?id=<%=product.getProductId() %>"
class="btn btn-secondary" role="button">
<!-- » = 특수문자 >> -->
상세 정보 »
</a>
</div>
<%
}
%>
</div>
<!-- 구분선 -->
<hr>
</div>
<%@ include file="Footer.jsp" %>
</body>
</html>| - images 출력에서 upload로 변경 |
Product.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="DTO.Product" %>
<%@ page import="DAO.ProductRepository" %>
<jsp:useBean id="productDAO" class="DAO.ProductRepository" scope="session" />
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>상품 상세 정보</title>
<link rel="stylesheet" href="./resources/css/bootstrap.min.css">
</head>
<body>
<%@ include file="Menu.jsp" %>
<div class="jumbotron">
<div class="container">
<h1 class="display-3">
상품 정보
</h1>
</div>
</div>
<%
String id = request.getParameter("id");
ProductRepository dao = ProductRepository.getInstance();
Product product = productDAO.getProductById(id);
%>
<div class="container">
<div class="row">
<div class="col-md-5">
<img src="./upload/<%=product.getFilename()%>"style="width:100%" />
</div>
<div class="col-md-6">
<h3><%=product.getPname() %></h3>
<p><%=product.getDescription() %>
<p><b>상품 코드: </b>
<span class="bagde badge-danger">
<%=product.getProductId() %>
</span>
<p><b>제조사: </b><%=product.getManufacturer() %>
<p><b>분류: </b><%=product.getCategory() %>
<p><b>재고: </b><%=product.getUnitsInStock() %>
<h4><%=product.getUnitPrice() %>원</h4>
<p><a href="#" class="btn btn-info">상품 주문 »</a>
<a href="./Products.jsp" class="btn btn-secondary">상품 목록 »</a>
</div>
</div>
<hr>
</div>
<%@ include file="Footer.jsp" %>
</body>
</html>| - images 출력에서 upload로 변경 |
addProduct.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>상품 등록</title>
<link rel="stylesheet" href="./resources/css/bootstrap.min.css">
</head>
<body>
<%@ include file="Menu.jsp" %>
<div class="jumbotron">
<div class="container">
<h1 class="display-3">상품 등록 </h1>
</div>
</div>
<div class="container">
<form name="newProduct" action="./process/AddProduct.jsp"
class="form-horizontal" method="post">
<div class="form-group row">
<label class="col-sm-2">상품 코드</label>
<div class="col-sm-3">
<input type="text" name="productId" class="form-control">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2">상품명</label>
<div class="col-sm-3">
<input type="text" name="name" class="form-control">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2">가격</label>
<div class="col-sm-3">
<input type="text" name="unitPrice" class="form-control">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2">상세 정보</label>
<div class="col-sm-3">
<textarea name="description" cols="50" rows="2"></textarea>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2">제조사</label>
<div class="col-sm-3">
<input type="text" name="manufacturer" class="form-control">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2">분류</label>
<div class="col-sm-3">
<input type="text" name="category" class="form-control">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2">재고 수</label>
<div class="col-sm-3">
<input type="text" name="unitsInStock" class="form-control">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2">상태</label>
<div class="col-sm-5">
<input type="radio" name="condition" value="New " >
신규 제품
<input type="radio" name="condition" value="Old " >
중고 제품
<input type="radio" name="condition" value="Refurbished " >
재생 제품
</div>
</div>
<div class="form-group row">
<label class="col-sm-2">이미지</label>
<div class="col-sm-5">
<input type="file" name="productImage" class="form-control">
</div>
</div>
<div class="form-group row">
<div class="col-sm-offset-2 col-sm-10">
<input type="submit" class="btn btn-primary" value="등록" >
</div>
</div>
</form>
</div>
<%@ include file="Footer.jsp" %>
</body>
</html>| - css 파일 경로 수정 - 이미지 등록(파일 업로드) 항목 폼에 추가 |
processAddProduct.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="com.oreilly.servlet.*" %>
<%@ page import="com.oreilly.servlet.multipart.*" %>
<%@ page import="java.util.*" %>
<%@ page import="DTO.Product" %>
<%@ page import="DAO.ProductRepository" %>
<%
request.setCharacterEncoding("UTF-8");
String filname = " ";
String realFolder = "./upload";
int maxSize = 5*1024*1024;
String encType = "utf-8";
MultipartRequest multi = new MultipartRequest(request, realFolder,
maxSize, encType, new DefaultFileRenamePolicy());
String productId = multi.getParameter("productId");
String name = multi.getParameter("name");
String unitPrice = multi.getParameter("unitPrice");
String description = multi.getParameter("description");
String manufacturer = multi.getParameter("manufacturer");
String category = multi.getParameter("category");
String unitsInStock = multi.getParameter("unitsInStock");
String condition = multi.getParameter("condition");
Integer price;
if(unitPrice.isEmpty()){
price = 0;
}
else{
price = Integer.valueOf(unitPrice);
}
long stock;
if(unitsInStock.isEmpty()){
stock = 0;
}
else{
stock = Long.valueOf(unitsInStock);
}
Enumeration files = multi.getFileNames();
String fname = (String)files.nextElement();
String fileName = multi.getFilesystemName(fname);
ProductRepository dao = ProductRepository.getInstance();
Product newProduct = new Product();
newProduct.setProductId(productId);
newProduct.setPname(name);
newProduct.setUnitPrice(price);
newProduct.setDescription(description);
newProduct.setManufacturer(manufacturer);
newProduct.setCategory(category);
newProduct.setUnitsInStock(stock);
newProduct.setCondition(condition);
newProduct.setFilename(fileName);
dao.addProduct(newProduct);
response.sendRedirect("Products.jsp");
%>| - import 추가 - MultipartRequest 클래스 객체 multi 추가 - 자체 request에서 변수 multi로 값 받아오게 변경 - nextElement() 메소드와 getFilesystemName() 메소드 추가 - setFilename() 추가 |
Products.jsp
Product.jsp
addProduct.jsp
728x90
반응형
'Code > Market' 카테고리의 다른 글
| 09. 상품 등록 페이지의 다국어 처리하기 (0) | 2020.11.18 |
|---|---|
| 08. 상품 등록 데이터의 유효성 검사하기 (0) | 2020.09.29 |
| 06. 상품 등록 페이지 만들기 (0) | 2020.09.29 |
| 05. 상품 상세 정보 표시하기 (0) | 2020.09.25 |
| 04. 상품 목록 표시하기 (0) | 2020.09.25 |