본문 바로가기
Servlet-Jsp

운동기록프로그램(servlet-jsp) #01

by 지민재 2022. 8. 7.
반응형
SMALL
controller 패키지 생성 후  MainController 클래스 만들기고 HttpServlet 상속 받기
package controller;


import javax.servlet.http.HttpServlet;

public class MainController extends HttpServlet{


	
}

 

 

wedapp 에서 main 폴더 생성 후 index.jps 생성 후 아래 코드 입력
<%@ page contentType="text/html; charset=utf-8" %>

 

 

MainController 클래스 작성 
package controller;

import java.io.IOException;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class MainController extends HttpServlet{

	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		RequestDispatcher rd = req.getRequestDispatcher("main/index.jsp");
		rd.forward(req, resp)
	}
	
}
RequestDispatcher : 버퍼를 통제한다. 즉 출력하는 버퍼에 있는 내용을 main/index.jsp로 바꾼다.  그래서 main/index.jsp 로 이동함 forword 이나 include 와 비슷하다.

 

 

 

연습으로 MainController 와 서블릿을 연결해보았다. 굳이 이렇게 할 필요는 없다고 하지만 그래도 연습..! 째든..
서블릿 작성
<?xml version="1.0" encoding="UTF-8"?>

<web-app version="4.0" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee 
http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd">
<servlet>
<servlet-name>main-servlet</servlet-name>
<servlet-class>controller.MainController</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>main-servlet</servlet-name>
<url-pattern>/main</url-pattern>
</servlet-mapping>

</web-app>

 

webapp 에 index.jsp를 추가로 생성해 main/index.jsp 로 이동하게 설정해줬다. 
<%@ page contentType="text/html; charset=utf-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<c:redirect url="/main"/>​

 

taglib 를 이용해 reirect 로 /main을 지정해주었다. 그러면 http://localhost:3001/erp 만 입력해도 자동적으로 c:url 이 앞에 Contextpath를 붙여줘서 http://localhost:3001/erp/main 로 바꾸어준다. taglib 말고 자바코드로 Contextpath를 이용해 할 수 있는데 jsp 에 자바코드는 되도록이면 안쓰는게 좋다고 한다. 

 

 

 

이제 헤더 본문 하단을 나누어 각 구역에 출력하고 싶은 것만 출력하기 위해  
outline 폴더를 만들어 footer.jsp 와 header.jsp 를 생성하였다.

 footer.jsp 와 header.jsp 에도 아래 코드를 넣어주었다.

<%@ page contentType="text/html; charset=utf-8" %>

 

 

header.jsp 작성 
<%@ page contentType="text/html; charset=utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css"
	href="<c:url value="/css/style.css"/>">
<script src="<c:url value="/js/common.js"/>"></script>
<title>운동기록프로그램(erp)</title>
<body>
	<header>
		<h1>운동기록</h1>
	</header>
	<main>
마찬가지로 taglib 를 이용해 css 와 js 쓸 수 있게 링크 설정 하였다.  폴더는 css 와 js 폴더 각각 webapp안에 생성하였다.

 

 

footer.jsp 작성
<%@ page contentType="text/html; charset=utf-8" %>
</main>
<foorer>
<h1>하단</h1>
<iframe name="ifrmProcess" width="100%" height="0" class="dn"></iframe>
</foorer>
</body>
</html>
페이지 이동없이 현재페이지에서 처리하기 위해 iframe 을 이용하였다. dn 클래스는 display : none  클래스를 이따가 작성 

 

 

footer.jsp 와 header.jsp 를 띄우기 위해 아래 코드를 작성 
<%@ page contentType="text/html; charset=utf-8" %>
<jsp:include page = "../outline/header.jsp"/>
<jsp:include page = "../outline/footer.jsp"/>
이동 경로는  mian 밖으로 나가서 webapp에 outline 로 접근해야하기 때문에 ../ 맨앞에 으로 상위폴더로 나가서 outline 으로 접근 하였다. 

아래와 같은 구성으로 클래스를 작성 하자
위에 서블릿은 연습용 이었고 이제 @Webservlet 을 이용하여 편하게 사용하자

GET method --출력--
운동기록 목록 : MainController - /main

POST method : --데이터 처리--
운동기록 추가 -/register 
운동기록 삭제 -/delete 
운동기록 수정 -/update 

 

RegisterController 클래스 작성
package controller;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/register")
public class RegisterController extends HttpServlet{

	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		
		
	}

}
Post 방식 메서드 추가 

 

 

UpdateController 클래스와 DeleteController 작성
package controller;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/update")
public class UpdateController extends HttpServlet{

	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		
		
	}

}
package controller;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/delete")
public class DeleteController extends HttpServlet{

	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		
		
	}

}

 

main > index.jsp 코드 추가 
<%@ page contentType="text/html; charset=utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<jsp:include page="../outline/header.jsp" />
<h2>운동기록 추가</h2>
<form name="frmRegist" method="post" action="<c:url value="/register"/>" target="ifrmProcess">

<div class = 'sports_wrap'>
	<input type="radio" name="sports" value="CHEST" id="sports_CHEST">
	<label for="sports_CHEST">가슴</label>
	
	<input type="radio" name="sports" value="BACK" id="sports_BACK">
	<label for="sports_back">등</label>
	
	<input type="radio" name="sports" value="SHOULER" id="sports_SHOULER">
	<label for="sports_shoulder">어깨</label>
	
	<input type="radio" name="sports" value="LOWERBODY" id="sports_LOWERBODY">
	<label for="sports_lowerbody">하체</label>
	
	<input type="radio" name="sports" value="ARM" id="sports_ARM">
	<label for="sports_CHEST">팔</label>
</div>

	<input type="text" name="sportNm" size ="30" placeholder="운동 종목 입력(bench press 등..)"><br>
	<input type="text" name="workoutSet" size ="30" placeholder="세트 수...(숫자만 입력하세요)"><br>
	<input type="text" name="workoutNum" size ="30" placeholder="횟수...(숫자만 입력하세요)"><br>
	<button type="submit">등록하기</button>

</form>
<jsp:include page="../outline/footer.jsp" />
텍스트를 눌러도 체크가 되게 설정 하기 위해 id 값을 넣고 lable for 를 이용하였다.
이부분과 <label for="sports_CHEST"> 
                id="sports_CHEST" << 부분이 동일해야 한다. 



 

댓글