정보처리기사 실기
🗓️6️⃣reg.jsp 작성하기 본문
reg.jsp 작성하기
일정등록 입력폼 만들기
앞에서 main.jsp까지 작성하면서 프로그램의 기본 화면을 만들었습니다.
이제부터는 실제 기능 화면을 만들어야 합니다.
이번 단계에서 작성할 파일은:
reg.jsp
입니다.
reg.jsp는 일정등록 화면입니다.
즉 사용자가 새로운 일정을 입력할 수 있도록:
일정번호
일정일자
회원번호
일정메모
입력칸을 만들어주는 페이지입니다.
1. 이번 문제에서 reg.jsp가 필요한 이유
문제에는 다음 메뉴가 있습니다.
일정등록
사용자가 이 메뉴를 클릭하면
새로운 일정을 입력할 수 있는 화면이 나와야 합니다.
따라서 우리는:
입력 화면
이 필요합니다.
그 역할을 하는 파일이 바로:
reg.jsp
입니다.
2. reg.jsp가 해야 하는 일
이번 문제에서 reg.jsp는 다음 역할을 합니다.
1. 일정번호 자동 생성
2. 일정일자 입력칸 만들기
3. 회원번호 입력칸 만들기
4. 일정메모 입력칸 만들기
5. 입력값이 비어 있는지 검사
6. 등록 버튼을 누르면 action.jsp로 이동
7. 조회 버튼을 누르면 조회 화면으로 이동
중요한 점은 reg.jsp가 직접 DB에 저장하는 파일은 아니라는 것입니다.
reg.jsp → 입력 화면
action.jsp → DB 저장 처리
이렇게 역할이 나누어져 있습니다.
3. reg.jsp 전체 코드
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import = "java.sql.*" %>
<%@ page import = "DBPKG.Util" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>일정등록</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script>
function check_val(){
var do_date = document.fm.do_date.value;
if(do_date==""){
alert("일정일자를 입력하지 않았습니다.");
fm.do_date.focus();
return false;
}
var fk_member = document.fm.fk_member.value;
if(fk_member==""){
alert("회원번호를 입력하지 않았습니다.");
fm.fk_member.focus();
return false;
}
var do_memo = document.fm.do_memo.value;
if(do_memo==""){
alert("일정메모를 입력하지 않았습니다.");
fm.do_memo.focus();
return false;
}
}
</script>
</head>
<%
request.setCharacterEncoding("UTF-8");
Connection conn = Util.getConnection();
Statement stmt = conn.createStatement();
String sql = " SELECT TRIM(to_char(max(pk_schedule)+1)) AS pk_schedule "+
" FROM tbl_schedule ";
ResultSet rs = stmt.executeQuery(sql);
rs.next();
String pk_schedule = rs.getString("pk_schedule");
%>
<body>
<H4>일정등록</H4>
<FORM name='fm' action='action.jsp' onsubmit="return check_val()">
<TABLE border='1'>
<TR>
<TH align="center" width="300px">일정번호(자동발생)</TH>
<TD align="left" width="400px">
<INPUT type='text' name='pk_schedule' value='<%=pk_schedule %>' readonly>
</TD>
</TR>
<TR>
<TH align="center">일정일자</TH>
<TD align="left" width="400px">
<INPUT type='text' name='do_date'>(ex: 20년 1월 1일>20250101)
</TD>
</TR>
<TR>
<TH align="center">회원번호</TH>
<TD align="left" width="400px">
<INPUT type='text' name='fk_member'>(ex: M0001)
</TD>
</TR>
<TR>
<TH align="center">일정메모</TH>
<TD align="left" width="400px">
<INPUT type='text' name='do_memo'>
</TD>
</TR>
<TR>
<TD align="center" colspan='2'>
<INPUT type='submit' value="등록">
<INPUT type='button' value="조회" onclick="location.href='list.jsp'">
</TD>
</TR>
</TABLE>
</FORM>
<%
rs.close();
conn.close();
stmt.close();
%>
</body>
</html>
4. DB를 사용하는 페이지이므로 import가 필요합니다
reg.jsp에서는 일정번호를 자동으로 가져오기 위해 DB에 접속합니다.
그래서 아래 코드가 필요합니다.
<%@ page import = "java.sql.*" %>
<%@ page import = "DBPKG.Util" %>
각 코드의 역할은 다음과 같습니다.
코드역할
| java.sql.* | DB 연결, SQL 실행 기능 사용 |
| DBPKG.Util | 우리가 만든 DB 연결 클래스 사용 |
즉 이 페이지는 단순 입력폼만 있는 것이 아니라
DB에서 다음 일정번호를 가져오는 작업도 합니다.
5. 입력값 검사 함수 만들기
function check_val(){
이 함수는 사용자가 등록 버튼을 눌렀을 때
입력칸이 비어 있는지 확인합니다.
이번 문제에서는 일정등록을 할 때 다음 값이 반드시 필요합니다.
일정일자
회원번호
일정메모
따라서 이 값들이 비어 있으면 등록되지 않게 막아야 합니다.
일정일자 검사
var do_date = document.fm.do_date.value;
if(do_date==""){
alert("일정일자를 입력하지 않았습니다.");
fm.do_date.focus();
return false;
}
이 코드는 일정일자 입력칸이 비어 있는지 확인합니다.
비어 있다면:
일정일자를 입력하지 않았습니다.
라는 경고창을 띄우고, 해당 입력칸으로 커서를 이동시킵니다.
회원번호 검사
var fk_member = document.fm.fk_member.value;
if(fk_member==""){
alert("회원번호를 입력하지 않았습니다.");
fm.fk_member.focus();
return false;
}
회원번호는 일정 테이블에서 회원 테이블과 연결되는 값입니다.
따라서 반드시 입력되어야 합니다.
일정메모 검사
var do_memo = document.fm.do_memo.value;
if(do_memo==""){
alert("일정메모를 입력하지 않았습니다.");
fm.do_memo.focus();
return false;
}
일정메모도 비어 있으면 등록할 수 없으므로
입력 여부를 확인합니다.
6. 일정번호를 자동으로 가져와야 하는 이유
문제 화면에서는:
일정번호(자동발생)
이라고 되어 있습니다.
즉 사용자가 직접 일정번호를 입력하는 것이 아니라,
DB에서 다음 번호를 자동으로 계산해서 보여줘야 합니다.
그래서 다음 SQL문을 사용합니다.
SELECT TRIM(to_char(max(pk_schedule)+1)) AS pk_schedule
FROM tbl_schedule
7. 자동번호 SQL 설명
현재 tbl_schedule에는 이미 일정번호가 있습니다.
예를 들어:
1
2
3
4
가 들어 있다면 다음 번호는:
5
가 되어야 합니다.
그래서:
max(pk_schedule)+1
을 사용합니다.
뜻은:
현재 가장 큰 일정번호를 찾고
거기에 1을 더한다
입니다.
to_char를 사용하는 이유
to_char(max(pk_schedule)+1)
숫자 결과를 문자 형태로 바꿉니다.
JSP 화면의 input value에 넣기 쉽게 처리하기 위해 사용합니다.
TRIM을 사용하는 이유
TRIM(to_char(max(pk_schedule)+1))
문자 변환 과정에서 생길 수 있는 앞뒤 공백을 제거합니다.
즉 화면에 깔끔하게 번호만 출력되도록 처리합니다.
8. DB 연결 코드
Connection conn = Util.getConnection();
Statement stmt = conn.createStatement();
이 코드는 Oracle DB와 연결하고 SQL 실행 준비를 하는 코드입니다.
코드의미
| Connection conn | DB 연결 |
| Statement stmt | SQL 실행 준비 |
9. SELECT 실행하기
ResultSet rs = stmt.executeQuery(sql);
rs.next();
자동번호를 가져오는 SQL은 조회문입니다.
조회문은:
executeQuery()
를 사용합니다.
그리고 결과값을 읽기 위해:
rs.next();
를 실행합니다.
이후 결과값을 변수에 저장합니다.
String pk_schedule = rs.getString("pk_schedule");
10. form 태그 만들기
<FORM name='fm' action='action.jsp' onsubmit="return check_val()">
이 코드는 입력폼을 만드는 부분입니다.
여기서 중요한 속성은 세 가지입니다.
속성의미
| name='fm' | JavaScript에서 폼을 찾기 위한 이름 |
| action='action.jsp' | 등록 버튼 클릭 시 이동할 페이지 |
| onsubmit | 전송 전 검사 함수 실행 |
즉 등록 버튼을 누르면 먼저 check_val()이 실행되고,
문제가 없으면 action.jsp로 이동합니다.
11. 일정번호 입력칸
<INPUT type='text' name='pk_schedule' value='<%=pk_schedule %>' readonly>
이 부분은 자동으로 계산된 일정번호를 화면에 보여주는 입력칸입니다.
여기서:
<%=pk_schedule %>
는 JSP 변수 값을 화면에 출력하는 코드입니다.
즉 DB에서 가져온 다음 일정번호를 input에 넣어줍니다.
readonly를 사용하는 이유
readonly
는 사용자가 값을 수정하지 못하게 하는 속성입니다.
일정번호는 자동발생 값이므로
사용자가 직접 수정하면 안 됩니다.
12. 일정일자 입력칸
<INPUT type='text' name='do_date'>(ex: 20년 1월 1일>20250101)
사용자가 일정일자를 입력하는 칸입니다.
예시를 함께 보여줘서:
20250101
형식으로 입력하도록 안내합니다.
13. 회원번호 입력칸
<INPUT type='text' name='fk_member'>(ex: M0001)
회원번호를 입력하는 칸입니다.
이 값은 tbl_member에 존재하는 회원코드여야 합니다.
예를 들어:
M0001
처럼 입력합니다.
14. 일정메모 입력칸
<INPUT type='text' name='do_memo'>
일정 내용을 입력하는 칸입니다.
예를 들어:
탐관오리 찾기
와 같은 내용을 입력할 수 있습니다.
15. 등록 버튼
<INPUT type='submit' value="등록">
등록 버튼입니다.
이 버튼을 누르면 form이 전송됩니다.
즉:
check_val() 실행
→ 입력값 검사
→ action.jsp로 이동
흐름으로 동작합니다.
16. 조회 버튼
<INPUT type='button' value="조회" onclick="location.href='list.jsp'">
조회 버튼입니다.
이 버튼을 누르면 list.jsp로 이동합니다.
다만 현재 프로젝트에서 일정현황을 확인하려면
list_j.jsp로 연결하는 것이 더 자연스러울 수 있습니다.
회원현황 조회라면 list.jsp,
일정현황 조회라면 list_j.jsp로 이동하면 됩니다.
17. DB 연결 닫기
rs.close();
conn.close();
stmt.close();
DB 사용이 끝났기 때문에 연결을 닫아줍니다.
실습에서는 코드가 짧아도
DB 관련 객체는 사용 후 닫아주는 습관을 들이는 것이 좋습니다.
18. 현재까지의 작업 흐름
db.sql
→ 회원 테이블과 일정 테이블 생성
Util.java
→ Oracle DB 연결
index.jsp
→ 전체 화면 틀 생성
style.css
→ 화면 디자인 적용
main.jsp
→ 프로그램 설명 화면
reg.jsp
→ 일정등록 입력폼 생성
19. 핵심 정리
이번 reg.jsp에서 중요한 것은 단순히 입력칸을 만드는 것이 아닙니다.
문제에서 요구한:
일정번호 자동발생
일정일자 입력
회원번호 입력
일정메모 입력
등록 전 빈칸 검사
기능을 화면에 구현하는 것입니다.
즉 reg.jsp는:
사용자에게 일정을 입력받는 화면
이고, 실제 DB 저장은 다음 단계에서 작성할:
action.jsp
가 담당하게 됩니다.
'🗓️ 일정관리 프로그램' 카테고리의 다른 글
| 🗓️8️⃣list.jsp 작성하기 (0) | 2026.05.26 |
|---|---|
| 🗓️7️⃣action.jsp 작성하기 (0) | 2026.05.26 |
| 🗓️5️⃣main.jsp 작성하기 (0) | 2026.05.26 |
| 🗓️4️⃣style.css 작성하기 (0) | 2026.05.26 |
| 🗓️3️⃣index.jsp 작성하기 (0) | 2026.05.26 |