[JSP & Servlet]/Program source (JSP & Servlet)
[JSP Action Tag] 20231218 - Calc(Javabean), Calc(jsp), Calc_ok1, Calc_ok2, Calc_ok3
Jelly-fish
2023. 12. 18. 12:58
0123
WebApp16
Calc.java
/*==================
Calc.java
====================*/
package com.test;
public class Calc
{
// 주요 속성 구성
private int su1; //-- 피연산자1 (정수 형태)
private String op; //-- 연산자 (문자열 형태)
private int su2; //-- 피연산자2 (정수 형태)
// 생성자 정의하지 않음 (사용자 정의 생성자 없음)
// → default 생성자 자동 삽입
// getter / setter 구성
public int getSu1()
{
return su1;
}
public void setSu1(int su1)
{
this.su1 = su1;
}
public String getOp()
{
return op;
}
public void setOp(String op)
{
this.op = op;
}
public int getSu2()
{
return su2;
}
public void setSu2(int su2)
{
this.su2 = su2;
}
// 메소드 추가
public String result()
{
String result = "";
int s = 0;
if (op != null)
{
if (op.equals("+"))
s = su1 + su2;
else if (op.equals("-"))
s = su1 - su2;
else if (op.equals("*"))
s = su1 * su2;
else if (op.equals("/"))
s = su1 / su2;
result = String.format("%d %s %d = %d", su1, op, su2, s);
}
return result;
}
}
Calc.jsp
<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Calc.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<!-- div>h1{JSP 액션 태그 실습}+hr -->
<div>
<h1>JSP 액션 태그 실습</h1>
<hr />
</div>
<!-- select[name="op"]>option[value="+"]{더하기} -->
<div>
<!-- 첫 번째 방법 -->
<!-- <form action="Calc_ok1.jsp" method="post" name="myForm"> -->
<!-- 두 번째 방법 -->
<!-- <form action="Calc_ok2.jsp" method="post" name="myForm"> -->
<!-- 세 번째 방법 -->
<form action="Calc_ok3.jsp" method="post" name="myForm">
<table class="table">
<tr>
<th>첫 번째 정수</th>
<td><input type="text" name="su1" class="txt"/></td>
</tr>
<tr>
<th>연산자</th>
<td>
<select name="op">
<option value="+">더하기</option>
<option value="-">빼기</option>
<option value="*">곱하기</option>
<option value="/">나누기</option>
</select>
</td>
</tr>
<tr>
<th>두 번째 정수</th>
<td><input type="text" name="su2" class="txt" /></td>
</tr>
<tr>
<td colspan="2">
<button type="submit" class="btn" style="width: 100%;"> = </button>
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
Calc_ok1.jsp
<%@page import="com.test.Calc"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%
// 이전 페이지(Calc.jsp)로부터 넘어온 데이터 수신
// → su1, su2, op
String strSu1 = request.getParameter("su1");
String strSu2 = request.getParameter("su2");
String op = request.getParameter("op");
int su1, su2;
su1 = su2 = 0;
String str = "";
// 아무것도 입력하지 않았을 땐, Calc.jsp 로 다시 돌려보내버림.
if (strSu1.equals("") || strSu2.equals("") || strSu1==null || strSu2==null)
{
response.sendRedirect("Calc.jsp");
}
else
{
su1 = Integer.parseInt(strSu1);
su2 = Integer.parseInt(strSu2);
// 자바에서 우리가 설계한 클래스를 사용하기 위해... 객체 생성
Calc ob = new Calc();
//-- 이클립스 자동완성 기능을 사용하여 구문을 작성할 경우
// 『"@page import="com.test.Calc"』 이 구문도 함께 생성되어 처리됨.
// 혹은, 자동완성 기능을 사용하지 않을 경우도
// 『"@page import="com.test.Calc"』이와 같은 구문을 직접 작성해서
// 해당 클래스를 사용할 수 있도록 처리해 주어야 함.
// 또는, 생성 구문에 직접 『com.test.Calc ob = new com.test.Calc();』
// 와 같이 작성하는 것도 가능함.
ob.setSu1(su1);
ob.setSu2(su2);
ob.setOp(op);
str = ob.result();
}
// 입력값을 getParameter("name") 으로 받아오고
// Calc() 의 객체 ob를 생성하고
// ob에 set 해 준 후
// 메소드를 호출하는 과정을 모두 수정으로 처리.
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Calc_ok1.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<!-- div>h1{첫 번째 방법 처리결과}+hr -->
<div>
<h1>첫 번째 방법 처리결과</h1>
<hr />
</div>
<div>
<!-- 결과 -->
<h2><%=str %></h2>
</div>
</body>
</html>
Calc_ok2.jsp
<%@page import="com.test.Calc"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%
/*
// 이전 페이지(Calc.jsp)로부터 넘어온 데이터 수신
// → su1, su2, op
String strSu1 = request.getParameter("su1");
String strSu2 = request.getParameter("su2");
String op = request.getParameter("op");
int su1, su2;
su1 = su2 = 0;
String str = "";
// 아무것도 입력하지 않았을 땐, Calc.jsp 로 다시 돌려보내버림.
if (strSu1.equals("") || strSu2.equals("") || strSu1==null || strSu2==null)
{
response.sendRedirect("Calc.jsp");
}
else
{
su1 = Integer.parseInt(strSu1);
su2 = Integer.parseInt(strSu2);
// 자바에서 우리가 설계한 클래스를 사용하기 위해... 객체 생성
Calc ob = new Calc();
//-- 이클립스 자동완성 기능을 사용하여 구문을 작성할 경우
// 『"@page import="com.test.Calc"』 이 구문도 함께 생성되어 처리됨.
// 혹은, 자동완성 기능을 사용하지 않을 경우도
// 『"@page import="com.test.Calc"』이와 같은 구문을 직접 작성해서
// 해당 클래스를 사용할 수 있도록 처리해 주어야 함.
// 또는, 생성 구문에 직접 『com.test.Calc ob = new com.test.Calc();』
// 와 같이 작성하는 것도 가능함.
ob.setSu1(su1);
ob.setSu2(su2);
ob.setOp(op);
str = ob.result();
}
*/
%>
<%
// 이전 페이지로부터 데이터를 받는
// 구문을 모두 주석 처리 해보고...
// jsp 액션 태그를 사용해 보자.
/*
String strSu1 = request.getParameter("su1");
int su1 = Integer.parseInt(strSu1);
*/
%>
<!-- Calc 클래스의 객체를 현재 페이지에서 사용할 수 있도록 지정 -->
<jsp:useBean id="ob" class="com.test.Calc"></jsp:useBean>
<!--*******************************************************************************-->
<!-- 서블릿 컨테이너가 내부적으로 Calc() 인스턴스 생성해 줌.
ob라는 식별자로 이 인스턴스를 쓰겠다. -->
<!--*******************************************************************************-->
<!-- 이 구문은 스크립릿 영역에서
『com.test.Calc ob = new com.test.Calc();』
을 작성하여 import구문을 자동으로 처리한 것과
마찬가지 효과를 적용하게 된다. -->
<!-- request.getParameter() 메소드를 통해 넘겨받은(전달받은) 데이터를
『Calc』 클래스를 기반으로 만들어진 『ob』 객체에
넘겨주기 위한 속성 지정 -->
<%-- <jsp:setProperty property="su1" name="ob" value="<%=su1 %>"/> --%>
<!--*******************************************************************************-->
<!-- ob.setSu1(su1) 을 처리해 준 것! -->
<!-- name이 똑같으면 getParameter("name")을 해주지 않아도 자동으로 받아온다! -->
<!--*******************************************************************************-->
<%-- <jsp:setProperty property="su1" name="ob" value="<%=su1 %>"/> --%>
<!-- 이 구문은 Calc_ok1.jsp 의 『ob.setSu1(su1);』 과 같은 구문 -->
<!-- check~!!! -->
<!-- ※ 속성 이름과 동일한 파라미터인 경우
『getParameter()』 메소드 없이 바로 받을 수 있다. -->
<!--=============================================================================
① ob 객체(Calc()) 내부의 속성 변수 이름이 su1인 것을 찾고 그 값을 가져와 준다.
② property 를 작성해 주는 순간 그 속성 변수(su1)에 맞게 적절한 데이터 타입으로 값을 수신하게 된다.
③ su1 → int 타입이므로 직접 변환해 줬지만 액션 태그는 자동으로 처리해 준다.
④ private 변수에 값을 대입할 때, 자신이 직접 setter() 를 호출해서 변수 값을 지정해 준다.
=============================================================================-->
<!-- ob.su1 = xxx; -->
<jsp:setProperty property="su1" name="ob"/>
<!-- ① request.getParameter() 처리 → 매개변수를 전달하기 위한 데이터 수신 처리 -->
<!-- ② Integer.parseInt() 처리 → 매개변수를 전달하기 위한 형 변환 처리 -->
<!-- ③ ob.su1 → ob.setSu1() 호출 처리 -->
<!-- ==> 최종적으로 ob → Calc 기반의 ob 객체의 su1 속성에
이전 페이지로부터 넘겨받은 데이터를 적절한 타입(형)으로 전달 -->
<jsp:setProperty property="su2" name="ob"/>
<jsp:setProperty property="op" name="ob"/>
<%--
※ Javabean 객체를 jsp:useBean으로 사용할 땐, 객체명을 id로. (id="ob")
※ Javabean 객체의 변수 값들을 jsp:setProperty로 지정해 줄 땐, 객체명을 name으로. (name="ob")
[자바 빈을 사용. → <jsp:useBean> 자바 빈 객체 생성 『Calc()』]
객체명 자바빈의 클래스주소
① <jsp:useBean id="ob" class="com.test.Calc"></jsp:useBean>
[객체에 대한 값들을 입력 값으로 지정 (단, name과 자바 빈 변수명이 동일해야 함)]
② <jsp:setProperty name="ob" property="su1" />
<jsp:setProperty name="ob" property="su2" />
<jsp:setProperty name="ob" property="op" />
→ 변수명과, 변수의 개수 모두 사용자 입력단의 name과 동일할 경우
『*』을 통해 처리 가능 (Calc_ok3.jsp)
만약, 모두 동일하지 않을 경우
같은 변수명과 name에 해당하는 값만 set되게 된다.
<jsp:setProperty name="ob" property="*" />
※※※※※※※※※※※※※※※※※※※※※※※※※※※※
<jsp> 액션 태그의 경우에도...
jsp 문법이기 때문에
주석 사용시 jsp 주석으로 꼭 바꿔줘야 돼!!!!!!!!!!!!
※※※※※※※※※※※※※※※※※※※※※※※※※※※※
--%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Calc_ok2.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div>
<h1>두 번째 방법 처리결과</h1>
<hr />
</div>
<div>
<!-- 결과 -->
<%-- <h2><%=str %></h2> --%>
<h2><%=ob.result() %></h2>
</div>
</body>
</html>
Calc_ok3.jsp
<%@page import="com.test.Calc"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%--
<jsp:useBean id="ob" class="com.test.Calc"></jsp:useBean>
<jsp:setProperty property="su1" name="ob"/>
<jsp:setProperty property="su2" name="ob"/>
<jsp:setProperty property="op" name="ob"/>
--%>
<!--▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤-->
<!-- [*] 을 통해서 Javabean의 속성을 모두 입력값으로 set해 줌!!! -->
<!--▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤▤-->
<jsp:useBean id="ob" class="com.test.Calc"></jsp:useBean>
<jsp:setProperty property="*" name="ob"/>
<!--
ob 객체의 속성 이름과, getParameter("name") 으로 받아오는 이름이
전부 일치해야 『property="*"』 를 사용할 수 있다!
-->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Calc_ok3.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div>
<h1>세 번째 방법 처리결과</h1>
<hr />
</div>
<div>
<!-- 결과 -->
<%-- <h2><%=str %></h2> --%>
<h2><%=ob.result() %></h2>
</div>
</body>
</html>`