gwooden_코린이

jsp를 이용한 회원가입 페이지 한국어/영어 구현해보기 본문

JSP&Servlet

jsp를 이용한 회원가입 페이지 한국어/영어 구현해보기

gwooden22 2023. 1. 27. 21:50
728x90
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

${request.getParameter("lang")}
<fmt:setLocale value='<%=request.getParameter("lang") %>' />
<fmt:bundle basename="bundle.singupBundle">

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
</head>
<body>

   <div class="alert alert-secondary fs-3" role="alert">
    <fmt:message key="title"/>	
   </div>


   <div class="container mt-3">
      <div class="text-end">
        <a class="btn btn-primary me-md-2" href="?lang=ko">한국어</a>
        <a class="btn btn-primary" href="?lang=en">English</a>
      </div>
      
      <form method="get" action="test.jsp">
        <div class="mb-3">
          <label for="name" class="form-label"><fmt:message key="name"/></label>
          <input type="text" class="form-control" id="name">
        </div>
        
        <div class="mb-3">
          <label for="id" class="form-label"><fmt:message key="id"/></label>
          <input type="text" class="form-control" id="id">
        </div>
        
        <div class="mb-3">
          <label for="pw" class="form-label"><fmt:message key="pw"/></label>
          <input type="password" class="form-control" id="pw">
        </div>
        
        <div class="mb-3">
           <select class="form-select">
            <option value="1"><fmt:message key="list1"/></option>
            <option value="2"><fmt:message key="list2"/></option>
            <option value="3"><fmt:message key="list3"/></option>
           </select>
        </div>
        
        <div class="mb-3">
          <input type="radio" name="gender" value="male"><fmt:message key="male"/>
          <input type="radio" name="gender" value="female"><fmt:message key="female"/>
        </div>
        
        <button type="submit" class="btn btn-primary"><fmt:message key="btn"/></button>
      </form>
   </div>
</body>
</html>

</fmt:bundle>


예) 1번 페이지
이름을 입력
나이도 입력
2번 페이지로 전송

<form method="get" action="2번 페이지">
              이름과 나이를 입력한 input
              전송
</form>
주소/2번페이지로 이동해주세요 =>  ~~~~/2번 페이지


2번 페이지
1번 페이지에서 입력한 이름과 나이를 이용해서 뭔가 처리를 함
<form method="get" action="test.jsp">
        <div class="mb-3">
          <label for="name" class="form-label"><fmt:message key="name"/></label>
          <input type="text" class="form-control" id="name">
        </div>
        
        <div class="mb-3">
          <label for="id" class="form-label"><fmt:message key="id"/></label>
          <input type="text" class="form-control" id="id">
        </div>
        
        <div class="mb-3">
          <label for="pw" class="form-label"><fmt:message key="pw"/></label>
          <input type="password" class="form-control" id="pw">
        </div>
        
        <div class="mb-3">
           <select class="form-select">
            <option value="1"><fmt:message key="list1"/></option>
            <option value="2"><fmt:message key="list2"/></option>
            <option value="3"><fmt:message key="list3"/></option>
           </select>
        </div>
        
        <div class="mb-3">
          <input type="radio" name="gender" value="male"><fmt:message key="male"/>
          <input type="radio" name="gender" value="female"><fmt:message key="female"/>
        </div>
        
        <button type="submit" class="btn btn-primary"><fmt:message key="btn"/></button>
      </form>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	2번 페이지
</body>
</html>

예) 1번 페이지
이름을 입력
나이도 입력
2번 페이지로 전송

<form method="get" action="2번 페이지">
              이름과 나이를 입력한 input
              전송
</form>
주소/2번페이지로 이동해주세요 =>  ~~~~/2번 페이지.jsp
입력한 이름과 나이를 포함해서 2번 펭지로 보내주세요
=> url : ~~~~/2번 페이지.jsp?이름=xxx & 나이=xxx
2번페이지에서는 이름과 나이를 사용 가능


2번 페이지
1번 페이지에서 입력한 이름과 나이를 이용해서 뭔가 처리를 함
<div class="mb-3">
          <label for="name" class="form-label"><fmt:message key="name"/></label>
          <input type="text" class="form-control" id="name" name="name">
        </div>
        
        <div class="mb-3">
          <label for="id" class="form-label"><fmt:message key="id"/></label>
          <input type="text" class="form-control" id="id" name="id">
        </div>


<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	2번 페이지 <br>
	<%= request.getParameter("name")%> <br>
	<%=request.getParameter("id")%>
</body>
</html>

728x90

'JSP&Servlet' 카테고리의 다른 글

이클립스 JSP/서블릿 JDBC 사용해보기  (0) 2023.01.27
서블릿 필터 기능  (0) 2023.01.27
fmt 태그 사용해보기  (0) 2023.01.26
JSTL 자카르타 아파치 사용해보기  (0) 2023.01.26
표현언어(EL)로 내장객체  (0) 2023.01.26
Comments