라이브러리 추가
JSP | EL, JSTL 태그 라이브러리
EL, JSTL 태그 라이브러리 EL - 표현 언어 EL(Expression Language)란, 표현식 또는 액션태그를 대신해서 값을 표현하는 언어 EL의 내장객체 JSTL - 자바서버 페이지 표준 태그 라이브러리 EL 표기법 예제 E.
kjh95.tistory.com
한글로 되어있는 페이지 영어 지원 만들기
kr.gov.resourceBundle 패키지 생성
ResourceBundle 파일생성
message.properties => default값으로 생성된 properties
#Generated by ResourceBundle Editor (http://essiembre.github.io/eclipse-rbe/)
title = \uC0C1\uD488 \uB4F1\uB85D
productId=\uC0C1\uD488 \uCF54\uB4DC
pname=\uC0C1\uD488\uBA85
unitprice=\uAC00\uACA9
description=\uC0C1\uC138 \uC815\uBCF4
menufecturer=\uC81C\uC870\uC0AC
category=\uBD84\uB958
numberOfstock=\uC81C\uACE0 \uC218
condition=\uC0C1\uD0DC
productImage=\uC774\uBBF8\uC9C0
button=\uB4F1\uB85D
New=\uC2E0\uADDC \uC81C\uD488
Old=\uC911\uACE0 \uC81C\uD488
Refurbished=\uC7AC\uC0DD \uC81C\uD488
message_en.properties => 영어값으로 생성된 properties
#Generated by ResourceBundle Editor (http://essiembre.github.io/eclipse-rbe/)
title=Product Addition
productId=Product ID
pname=Name
unitprice=Price
description=Description
menufecturer=Menufecturer
category=Category
numberOfstock=NumberOfstock
condition=Condition
productImage=Image
button=Enrollment
New=New Product
Old=Old Product
Refurbished=Refurbished Product
addProduct.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>상품 등록</title>
<link rel="stylesheet" href="./resources/css/bootstrap.min.css">
<script type="text/javascript" src="./resources/js/vaildation.js"></script>
</head>
<body>
<fmt:setLocale value='<%=request.getParameter("language") %>'/>
<fmt:bundle basename="kr.gov.resourceBundle.message">
<jsp:include page="menu.jsp"/>
<!-- 점보트론 : 대형전광판이라는 의미. 점보트론 안에 다양한 컴포넌트(텍스트,이미지,회사로고 등) 포함 가능 -->
<div class="jumbotron">
<div class="contaner">
<!-- <h1 class="display-3">상품 등록</h1> -->
<h1 class="display-3"><fmt:message key="title" /></h1>
</div>
</div>
<div class="container">
<!-- 한글 혹은 영어로 표시할지 선택하는 부분 -->
<div class="text-right">
<a href="?language=ko">korean</a>||<a href="?language=en">English</a>
</div>
<!-- class = "form-horizontal" : 폼요소들이 수평적으로 배치되도록 해주는 속성 -->
<form action="./processAddProduct.jsp" name="newProduct" class="form-horizontal"
method="post" enctype="multipart/form-data">
<div class="form-group row">
<!-- 화면크기 768px 이상일때 col-sm-?이 부분이 적용되고, div요소의 block특성에 의해
100%너비를 가지면 수직으로 쌓이게 만들어준다. -->
<label class="col-sm-2"><b><fmt:message key="productId" /></b></label>
<div class="col-sm-3">
<input type="text" id="productId" name="productId" class="form-control" placeholder="상품코드를 입력하세요.">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="pname" /></b></label>
<div class="col-sm-3">
<input type="text" id="pname" name="pname" class="form-control" placeholder="상품명를 입력하세요.">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="unitprice" /></b></label>
<div class="col-sm-3">
<input type="text" id="unitprice" name="unitprice" class="form-control" placeholder="가격을 입력하세요.">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="description" /></b></label>
<div class="col-sm-5">
<textarea rows="2" cols="50" name="description" class="form-control"></textarea>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="menufecturer" /></b></label>
<div class="col-sm-5">
<input type="text" name="menufecturer" class="form-control" placeholder="제조사를 입력하세요.">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="category" /></b></label>
<div class="col-sm-5">
<input type="text" name="category" class="form-control" placeholder="분류를 입력하세요.">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="numberOfstock" /></b></label>
<div class="col-sm-5">
<input type="text" id="numberOfstock" name="numberOfstock" class="form-control" placeholder="제고 수를 입력하세요.">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="condition" /></b></label>
<div class="col-sm-5">
<input type="radio" name="condition" value="New"><fmt:message key="New" />
<input type="radio" name="condition" value="Old"><fmt:message key="Old" />
<input type="radio" name="condition" value="Refurbished"><fmt:message key="Refurbished" />
</div>
</div>
<!-- 상품 이미지 업로드 부분 -->
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="productImage" /></b></label>
<div class="col-sm-5">
<input type="file" name="productImage" class="form-control">
</div>
</div>
<div class="form-group row">
<!-- offset지점은 col의 2만큼 띄움 -->
<div class="col-sm-offset-2 col-sm-10">
<!-- 타입을 button으로 바꾸는 이유 : submit타입을 주게되면 유효성 검사하다가
오류가 발생하더라도 action의 속성값으로 페이지 이동이 일어나기 때문이다. -->
<input type="button" class="btn btn-primary" value="<fmt:message key="button" />" onclick="checkAddProduct()">
</div>
</div>
</form>
</div>
</fmt:bundle>
</body>
</html>
