본문 바로가기
JSP, Servlet, MySQL/JSP - webmarket

내장 객체 : 상품 상세 정보 표시하기 2

샤리미 2023. 9. 3. 06:11
728x90
반응형

chapter5-2

04. out 내장 객체의 기능과 사용법

out내장 객체는 웹 브라우저에 데이터를 전송하는 출력 스트림 객체이다. jsp 컨테이너는 jsp 페이지에 사용되는 모든 표현문 태그와 HTML, 일반 텍스트 등을 out 내장 객체를 통해 웹 브라우저에 그대로 전달한다. out 내장 객체는 스크립틀릿 태그에 사용하여 단순히 값을 출력하는 표현문 태그(<%=…..%>)와 같은 결과를 얻을 수 있다.

out 내장 객체 메소드 반환 유형 설명

print(String str) void 설정된 str 값을 웹 브라우저에 출력한다
println(String str) void 설정된 str 값을 웹 브라우저에 출력한다. 이땨 줄바꿈(\n\r 또는 \n)이 적용 되지 않는다.
newLine() void 줄바꿈(\r\n 또는 \n)을 출력한다
getBufferSize() int 현재 출력 버퍼의 크기를 가져온다
getRemaining() int 현재 남아 있는 출력 버퍼의 크기를 가져온다
clear() void 현재 출력 버퍼에 저장되어 있는 내용을 웹 브라우저에 전송하지 않고 비운다. 만약 버퍼가 이미 플러시 되었다면 IOException이 발생한다
clearBuffer() void 현재 출력 버퍼에 저장되어 있는 내용을 웹 브라우저에 전송하지 않고 비운다. 만약 버퍼가 이미 플러시 되었다면 IOException 이 발생하지 않는다
flush() void 현재 출력 버퍼에 저장되어 있는 내용을 웹 브라우저에 전송하고 비운다
isAutoFlush() boolean 출력 버퍼가 채워졌을 때의 처리를 결정한다. 자동으로 플러시하는 경우 true를 반환하고 그렇지 않은 경우 false를 반환한다

[out 내장 객체로 오늘의 날짜 및 시각 출력하기]

<%@ page contentType="text/html; charset=utf-8" %>
<html>
<head>
	<title>Implicit Objects</title>
</head>
<body>
	<%
		out.println("오늘의 날짜 및 시각" + "<br>");
		out.println(java.util.Calendar.getInstance().getTime());
	%>
</body>
</html>

[out 내장 객체로 폼 페이지에서 아이디와 비밀번호를 전송받아 출력하기]

/out02.jsp

<%@ page contentType="text/html; charset=utf-8" %>
<html>
<head>
	<title>Implicit Objects</title>
</head>
<body>
	<form action="out02_process.jsp" method="post">
		<p> 
			아 이 디 : <input type="text" name="id">
			비밀번호 : <input type="text" name="passwd">
			<input type="submit" value="전송" />
	</form>
</body>
</html>

/out02_process.jsp

<%@ page contentType="text/html; charset=utf-8" %>
<html>
<head>
	<title>Implicit Objects</title>
</head>
<body>
	<%
		request.setCharacterEncoding("utf-8");
		String userid = request.getParameter("id");
		String password = request.getParameter("passwd");
	%>
	<p>
	 	아 이 디 : <%out.println(userid); %>
	 	비밀번호 : <%out.println(password); %>
</body>
</html>

05. 상품 상세 정보 표시하기

내장 객체를 적용하여 웹 쇼핑몰의 상품 목록 중에서 선택한 상품의 상세 정보를 출력하고, 웹 쇼핑몰 시작 페이지의 현재 접속 시각이 자동으로 갱신되게 한다.

-상품 상세 정보 표시하기

[상품 데이터 접근 클래스 만들기]

  1. 상품 상세정보를 가져오는 메소드 만들기: PoductRepository 클래스에 다음과 같이 추가 작성한다.
package dto;

import java.util.ArrayList;

import dto.Product;

public class ProductiRepository {
	
	private ArrayList<Product> listOfProducts = new ArrayList<Product>();
	
	public ProductiRepository() {
		Product phone = new Product("P1234","iPhone 6s", 800000);
		phone.setDescription("4.7-inch, 1334X750 Renina HD display, 8-megapixel iSight Camera");
		phone.setCategory("Smart Phone");
		phone.setManufacturer("Apple");
		phone.setUnitsInStock(1000);
		phone.setCondition("New");
		
		Product notebook = new Product("P1235","LG PC 그램",150000);
		notebook.setDescription("13.3-inch, IPS LED display , 5rd Generation Intel Core processors");
		notebook.setCategory("Notebook");
		notebook.setManufacturer("LG");
		notebook.setUnitsInStock(1000);
		notebook.setCondition("Refurbishe");
		
		
		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");
		
		listOfProducts.add(phone);
		listOfProducts.add(notebook);
		listOfProducts.add(tablet);
		
		
	}
	
	public ArrayList<Product>getAllProducts(){
		return listOfProducts;
	}
	
	//상품 상세 정보 표시하기 chapter05
	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;
			}
		} //객체 변수 listOfProducts 에 저장된 모든 상품 목록에서 상품 아이디와 일치하는 상품을 가져오는 getProductById()메소드를 작성
		return productById;
	}
}

2.상품 상세 정보 버튼 만들기

<%@ page contentType="text/html; charset=utf-8"%>
<%@ page import="java.util.ArrayList"%>
<%@ page import="dto.Product" %>
<jsp:useBean id="productDAO" class="dto.ProductiRepository" scope="session" />
<html>
	<head>
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
		<title>상품목록</title>
	</head>
	<body>
		<jsp:include page="menu.jsp"/>
		<div class="jumbotron">
			<div class="container">
				<h1 class="display-3">상품 목록</h1>
			</div>
		</div>
		<%
			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">
					<h3><%= product.getPname() %></h3>
					<p><%= product.getDescription() %></p>
					<p><%= product.getUnitPrice() %>원</p>
					<p><a href="./product.jsp?id=<%=product.getProductId() %>"class = "btn btn-secondary" role="button"> 상세 정보 &raquo;</a>  //
				</div>
				<%
					}
				%>
			</div>
			<hr>
		</div>
		<jsp:include page="footer.jsp"/>
	</body>
</html>

3.상품 상세 정보 페이지 만들기: product.jsp 파일을 생성 후 다음과 같이 작성한다

<%@ page contentType="text/html; charset=utf-8"%>
<%@ page import="dto.Product" %> 
<!--  생성한 상품 클래스 dto.Product 패키기를 사용하기 위해 page 디렉티브 태그 import -->
<jsp:useBean id="productDAO" class="dto.ProductiRepository" scope="session" />
<!-- 자바빈즈로 생성한 ProductRepository 클래스를 사용하도록 useBean 액션 태그를 작성한다 -->
<html>
	<head>
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
		<title>상품 상세 정보</title>
	</head>
	<body>
		<jsp:include page="menu.jsp"/>
		<div class="jumbotron">
			<div class="container">
				<h1 class="display-3">상품 정보</h1>
			</div>
		</div>
		<%
			String id = request.getParameter("id"); //상품 목록 페이지로부터 전달되는 상품 아이디를 전송받도록 request내장 객체의 getParameter()메소드를 작성
			Product product = productDAO.getProductById(id);//useBean 액션 태그에 id 속성 값을 통해 ProductRepository클래스의 
		//getProductById()메소드를 호출하여 반환된 결과 값을 Product 객체 타입의 변수 Product 에 저장하도록 작성한다.  %>                                                 
		<div class="container">
			<div class="row">
				<div class="col=md-6"> <!-- Product 객체 타입의 변수 product 에 저장된 상품명, 상품 상세 정보, 상품 코드, 제조사, 분류, 재고 수 , 상품 가격 등을 
				출력하도록 표현문 태그를 작성 -->
						<h3><%=product.getPname() %></h3>
						<p><%=product.getDescription()%>
						<p> <b>상품 코드 : </b><span class="badge 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">상품 주문 &raquo;</a>
						<a href="./products.jsp" class="btn btn-secondary"> 상품 목록 &raquo;</a>
									
				</div>
			</div>
		</div>
		<jsp:include page="footer.jsp"/>
	</body>
</html>

[시작페이지의 접속 시각 자동 갱신하기]

 

 
 

/WebMarket/welcome.jsp 

<%@ page contentType="text/html; charset=utf-8" %>
<%@ page import="java.util.Date" %>
<html>
	<head>
	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
	 rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
		<title>Welcome</title>
	</head>
	<body>
		<%@ include file="menu.jsp" %>
		<%! String greeting = "웹 쇼핑몰에 오신 것을 환영합니다.";
		String tagline = "Welcome to Web Market!";%>
		
		<div class = "jumbotron">
			<div class= "container">
				<h1 class = "display-3">
					<%= greeting %>
				</h1>
			</div>
		</div>
		<div class = "container">
			<div class = "text-center">
				<h3>
					<%= tagline %>
				</h3>
				<%
					response.setIntHeader("Refresh",5); //5초마다 jsp페이지가 갱신되도록 response 내장객체의 setIntHeader()메소드를 작성
					Date day = new java.util.Date();
					String am_pm;
					int hour = day.getHours();
					int minute = day.getMinutes();
					int second = day.getSeconds();
					if(hour /12 ==0){
						am_pm = "AM";
					}else{
						am_pm = "PM";
						hour = hour -12;
					}
					String CT = hour +":" +minute + ":" + second + " " + am_pm;
					out.println("현재 접속 시각:" + CT +"\n");
				%>
			</div>
		</div>
		<%@ include file="footer.jsp" %>
	
	</body>
</html>

상품목록을 보여주는 페이지

 

상세정보를 누르면 나타나는 상품정보 페이지

 

728x90
반응형

'JSP, Servlet, MySQL > JSP - webmarket' 카테고리의 다른 글

폼 태그 : 상품 등록 페이지 만들기 2  (0) 2023.09.04
폼 태그 : 상품 등록 페이지 만들기  (3) 2023.09.03
내장 객체 : 상품 상세 정보 표시하기  (3) 2023.09.03
액션 태그 : 상품 목록 표시하기 3  (0) 2023.09.03
액션 태그 : 상품 목록 표시하기 2  (0) 2023.09.03

'JSP, Servlet, MySQL/JSP - webmarket' Related Articles

티스토리툴바