본문 바로가기

Programming/국비학원

221006 - JSP - 액션태그, EL

https://gap85.tistory.com/entry/JSP-태그-Tag-액션-태그

액션 태그
  • 회원가입 (액션태그 X)
  • memberForm.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원가입 창</title>
<script type="text/javascript">
	function fn_sendMember(){
		let frmMember = document.frmMember;
		let id = frmMember.id.value;
		let pwd = frmMember.pwd.value;
		let name = frmMember.name.value;
		let email = frmMember.email.value;
		
		if(id.length==0||id==""){
			alert('아이디를 입력해주세요');
		} else if (pwd.length==0||pwd==""){
			alert('비밀번호를 입력해주세요');
		} else if (name.length==0||name==""){
			alert('이름을 입력해주세요');
		} else if (email.length==0||email==""){
			alert('이메일을 입력해주세요');
		} else {
			frmMember.method="post";
			frmMember.action="member.jsp";
			frmMember.submit(); 
		}
	}
</script>
</head>
<body>
	<form name=frmMember>
		<h2>회원가입 창</h2>
		<table>
			<tr>
				<td>아이디</td>
				<td><input type="text" name="id"></td>
			</tr>
			<tr>
				<td>비밀번호</td>
				<td><input type="password" name="pwd"></td>
			</tr>
			<tr>
				<td>이름</td>
				<td><input type="text" name="name"></td>
			</tr>
			<tr>
				<td>이메일</td>
				<td><input type="text" name="email"></td>
			</tr>
		</table>
		<input type="button" value="가입하기" onclick="fn_sendMember()">
		<input type="reset" value="다시 입력">
		<input type="hidden" name="command" value="addMember"> <!-- ★어떤 목적(탈퇴면 value="delMember")으로 서버에 접근하는지 확인 -->
	</form>
</body>
</html>

 

 

 

  • member.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"
    import="java.util.*, jsp02.ex01.*"%>
<%
	request.setCharacterEncoding("utf-8");
	String id = request.getParameter("id");
	String pwd = request.getParameter("pwd");
	String name = request.getParameter("name");
	String email = request.getParameter("email");
	
	MemberBean memBean = new MemberBean(id, pwd, name, email); //새 회원 객체 bean 생성
	MemberDAO dao = new MemberDAO();
	
	dao.addMember(memBean); //bean 회원을 목록에 추가
	List memberList = dao.listMembers(); //목록 조회
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 목록</title>
</head>
<body>
	<table border="1" align="center">
		<tr align="center" bgcolor="beige">
			<td>아이디</td><td>비밀번호</td><td>이름</td><td>이메일</td><td>가입일</td>
		</tr>
	<%
		if(memberList.size()==0){
	%>
		<tr>
			<td colspan="5">등록된 회원이 없습니다</td>
		</tr>
	<%} else {
			for (int i=0;i<memberList.size();i++){
				MemberBean bean = (MemberBean) memberList.get(i);
	%>
		<tr>
			<td><%=bean.getId() %></td>
			<td><%=bean.getPwd() %></td>
			<td><%=bean.getName() %></td>
			<td><%=bean.getEmail() %></td>
			<td><%=bean.getJoinDate() %></td>
		</tr>
	<%		}
		}
	%>
	</table>
</body>
</html>

 

 

 

  • MemberBean (VO 역할)
public class MemberBean {

	private String id;
	private String pwd;
	private String name;
	private String email;
	private Date joinDate;
	
	public MemberBean() {
		
	}

	public MemberBean(String id, String pwd, String name, String email) {
		this.id = id;
		this.pwd = pwd;
		this.name = name;
		this.email = email;
	}

	public Date getJoinDate() {
		return joinDate;
	}

	public void setJoinDate(Date joinDate) {
		this.joinDate = joinDate;
	}

	public String getId() {
		return id;
	}

	public void setId(String id) {
		this.id = id;
	}

	public String getPwd() {
		return pwd;
	}

	public void setPwd(String pwd) {
		this.pwd = pwd;
	}

	public String getName() {
		return name;
	}

	public void setName(String name) {
		this.name = name;
	}

	public String getEmail() {
		return email;
	}

	public void setEmail(String email) {
		this.email = email;
	}
	
}

 

 

 

  • MemberDAO
public class MemberDAO {

	private Connection con; 
	private PreparedStatement pstmt; 
	private DataSource dataFactory; 
	
	public MemberDAO() { 
		try {
			Context ctx = new InitialContext();
			Context envContext = (Context)ctx.lookup("java:/comp/env");
			dataFactory = (DataSource) envContext.lookup("jdbc/oracle");
		} catch(Exception e) {
			System.out.println("DB 연결 실패");
		}
	}
	
	//회원정보 목록
	public List listMembers(){
		
		List list = new ArrayList();
		try {
			con = dataFactory.getConnection(); 
			String query = "select * from member_list";
			pstmt = con.prepareStatement(query);
			ResultSet rs = pstmt.executeQuery(); 
			while(rs.next()) { 
				String id = rs.getString("id");
				String pwd = rs.getString("pwd");
				String name = rs.getString("name");
				String email = rs.getString("email");
				Date joinDate = rs.getDate("joindate");
				
				MemberBean vo = new MemberBean();
				vo.setId(id);
				vo.setPwd(pwd);
				vo.setName(name);
				vo.setEmail(email);
				vo.setJoinDate(joinDate);
				
				list.add(vo);
			}
			rs.close();
			pstmt.close();
			con.close();
		} catch(Exception e) {
			System.out.println("자료 처리 중 에러 발생");
		}
		return list;
		
	}
	
	public void addMember(MemberBean bean) {
		try {
			con = dataFactory.getConnection();
			
			String id = bean.getId();
			String pwd = bean.getPwd();
			String name = bean.getName();
			String email = bean.getEmail();
			
			String query = "insert into member_list(id, pwd, name, email) values(?,?,?,?)";
			pstmt = con.prepareStatement(query);
			pstmt.setString(1, id);
			pstmt.setString(2, pwd);
			pstmt.setString(3, name);
			pstmt.setString(4, email);
			pstmt.executeUpdate();
			pstmt.close();
		} catch(Exception e) {
			System.out.println("회원 추가 중 에러 발생");
		}
	}
	
	public void delMember(String id) {
		try {
			con = dataFactory.getConnection();
			String query = "delete from member_list where id=?";
			pstmt = con.prepareStatement(query);
			pstmt.setString(1,id);
			pstmt.executeUpdate();
			pstmt.close();
		} catch(Exception e) {
			System.out.println("삭제 중 에러 발생");
		}
	}
	
}

 

 

 

 

  • useBean - 회원 삭제 기능 추가

: new 연산자 없이 객체 생성하기 

application, session, request, page 보관소에 저장된 자바 객체를 꺼냄
저장된 객체가 없으면 새로 생성, 해당 보관소에 저장

 

 

</jsp:usebean id="빈 이름 지정" class="클래스명 (패키지명 포함)" scope="저장될 영역">

 

 

 

  • member.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"
    import="java.util.*, jsp02.ex01.*"%>
<%
	request.setCharacterEncoding("utf-8");
%>	
<jsp:useBean id="memBean" class="jsp02.ex01.MemberBean" scope="page"></jsp:useBean>
////MemberBean 클래스 객체를 memBean 이름으로 생성
<% 	String command = request.getParameter("command");
	
	MemberDAO dao = new MemberDAO();
	
	if (command!=null && command.equals("addMember")){
		String id = request.getParameter("id");
		String pwd = request.getParameter("pwd");
		String name = request.getParameter("name");
		String email = request.getParameter("email");
		
		//MemberBean memBean = new MemberBean(id, pwd, name, email);
		memBean.setId(id);
		memBean.setPwd(pwd);
		memBean.setName(name);
		memBean.setEmail(email);
		dao.addMember(memBean); //bean 회원을 목록에 추가
	} else {
		String id = request.getParameter("id");
		dao.delMember(id);
	}
	List memberList = dao.listMembers(); //목록 조회
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 목록</title>
</head>
<body>
	<table border="1" align="center">
		<tr align="center" bgcolor="beige">
			<td>아이디</td><td>비밀번호</td><td>이름</td><td>이메일</td><td>가입일</td><td>삭제</td>
		</tr>
	<%
		if(memberList.size()==0){
	%>
		<tr>
			<td colspan="5">등록된 회원이 없습니다</td>
		</tr>
	<%} else {
			for (int i=0;i<memberList.size();i++){
				MemberBean bean = (MemberBean) memberList.get(i);
	%>
		<tr>
			<td><%=bean.getId() %></td>
			<td><%=bean.getPwd() %></td>
			<td><%=bean.getName() %></td>
			<td><%=bean.getEmail() %></td>
			<td><%=bean.getJoinDate() %></td>
			<td><a href="/jsp02/member.jsp?command=delMember&id=<%=bean.getId() %>">삭제</a></td>
		</tr>
	<%		}
		}
	%>
	</table>
</body>
</html>

 

 

 

 

  • setProperty

: useBean의 속성값 설정하는 태그


=> <jsp:useBean> 태그로 lookup 한 객체(Attribute)의 setter 메소드를 호출, property 값을 설정

 

 

<jsp:setProperty name="자바 빈 이름" property="속성명" value="값"/>

 

 

 

  • member3.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"
    import="java.util.*, jsp02.ex01.*"%>
<%
	request.setCharacterEncoding("utf-8");
%>	
<jsp:useBean id="memBean" class="jsp02.ex01.MemberBean" scope="page"></jsp:useBean>
<% 	String command = request.getParameter("command");
	
	MemberDAO dao = new MemberDAO();
	
	if (command!=null && command.equals("addMember")){
%>	
	
	<jsp:setProperty name="memBean" property="id" value='<%=request.getParameter("id") %>' /> ////
	<jsp:setProperty name="memBean" property="pwd" value='<%=request.getParameter("pwd") %>' /> ////
	<jsp:setProperty name="memBean" property="name" value='<%=request.getParameter("name") %>' /> ////
	<jsp:setProperty name="memBean" property="email" value='<%=request.getParameter("email") %>' /> ////
	
<%		dao.addMember(memBean); 
	} else {
		String id = request.getParameter("id");
		dao.delMember(id);
	}
	List memberList = dao.listMembers(); 
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 목록</title>
</head>
<body>
	<table border="1" align="center">
		<tr align="center" bgcolor="beige">
			<td>아이디</td><td>비밀번호</td><td>이름</td><td>이메일</td><td>가입일</td><td>삭제</td>
		</tr>
	<%
		if(memberList.size()==0){
	%>
		<tr>
			<td colspan="5">등록된 회원이 없습니다</td>
		</tr>
	<%} else {
			for (int i=0;i<memberList.size();i++){
				MemberBean bean = (MemberBean) memberList.get(i);
	%>
		<tr>
			<td><%=bean.getId() %></td>
			<td><%=bean.getPwd() %></td>
			<td><%=bean.getName() %></td>
			<td><%=bean.getEmail() %></td>
			<td><%=bean.getJoinDate() %></td>
			<td><a href="/jsp02/member.jsp?command=delMember&id=<%=bean.getId() %>">삭제</a></td>
		</tr>
	<%		}
		}
	%>
	</table>
</body>
</html>

 

 

 

  • param

=> HTTP 요청 파라미터 이름 (form의 요소 이름)

스크립트릿의 request.getParameter("param") 값에 해당함

 

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"
    import="java.util.*, jsp02.ex01.*"%>
<%
	request.setCharacterEncoding("utf-8");
%>	
<jsp:useBean id="memBean" class="jsp02.ex01.MemberBean" scope="page"></jsp:useBean>
<% 	String command = request.getParameter("command");
	
	MemberDAO dao = new MemberDAO();
	
	if (command!=null && command.equals("addMember")){
%>	
	
	<jsp:setProperty name="memBean" property="id" param="id" /> ////
	<jsp:setProperty name="memBean" property="pwd" param="pwd" /> ////
	<jsp:setProperty name="memBean" property="name" param="name" /> ////
	<jsp:setProperty name="memBean" property="email" param="email" /> ////
	
<%		dao.addMember(memBean); 
	} else {
		String id = request.getParameter("id");
		dao.delMember(id);
	}
	List memberList = dao.listMembers(); 
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 목록</title>
</head>
<body>
	<table border="1" align="center">
		<tr align="center" bgcolor="beige">
			<td>아이디</td><td>비밀번호</td><td>이름</td><td>이메일</td><td>가입일</td><td>삭제</td>
		</tr>
	<%
		if(memberList.size()==0){
	%>
		<tr>
			<td colspan="5">등록된 회원이 없습니다</td>
		</tr>
	<%} else {
			for (int i=0;i<memberList.size();i++){
				MemberBean bean = (MemberBean) memberList.get(i);
	%>
		<tr>
			<td><%=bean.getId() %></td>
			<td><%=bean.getPwd() %></td>
			<td><%=bean.getName() %></td>
			<td><%=bean.getEmail() %></td>
			<td><%=bean.getJoinDate() %></td>
			<td><a href="/jsp02/member.jsp?command=delMember&id=<%=bean.getId() %>">삭제</a></td>
		</tr>
	<%		}
		}
	%>
	</table>
</body>
</html>

 

 

 

  •  

요청 파라미터 값=액션태그 property 값 => param 지정 안 해도 자동 값 세팅

 

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"
    import="java.util.*, jsp02.ex01.*"%>
<%
	request.setCharacterEncoding("utf-8");
%>	
<jsp:useBean id="memBean" class="jsp02.ex01.MemberBean" scope="page"></jsp:useBean>
<%-- MemberBean 클래스 객체를 memBean 이름으로 생성 --%>
<% 	String command = request.getParameter("command");
	
	MemberDAO dao = new MemberDAO();
	
	if (command!=null && command.equals("addMember")){
%>	
	
	<jsp:setProperty name="memBean" property="id" /> ////
	<jsp:setProperty name="memBean" property="pwd" /> ////
	<jsp:setProperty name="memBean" property="name" /> ////
	<jsp:setProperty name="memBean" property="email" /> ////
	
<%		dao.addMember(memBean); 
	} else {
		String id = request.getParameter("id");
		dao.delMember(id);
	}
	List memberList = dao.listMembers(); 
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 목록</title>
</head>
<body>
	<table border="1" align="center">
		<tr align="center" bgcolor="beige">
			<td>아이디</td><td>비밀번호</td><td>이름</td><td>이메일</td><td>가입일</td><td>삭제</td>
		</tr>
	<%
		if(memberList.size()==0){
	%>
		<tr>
			<td colspan="5">등록된 회원이 없습니다</td>
		</tr>
	<%} else {
			for (int i=0;i<memberList.size();i++){
				MemberBean bean = (MemberBean) memberList.get(i);
	%>
		<tr>
			<td><%=bean.getId() %></td>
			<td><%=bean.getPwd() %></td>
			<td><%=bean.getName() %></td>
			<td><%=bean.getEmail() %></td>
			<td><%=bean.getJoinDate() %></td>
			<td><a href="/jsp02/member.jsp?command=delMember&id=<%=bean.getId() %>">삭제</a></td>
		</tr>
	<%		}
		}
	%>
	</table>
</body>
</html>

 

 

 

  • property

<jsp:setProperty name="memBean" property="*" />

=> 요청 파라미터(html)를 검사, 속성명이 동일한 멤버변수(MemberBean)를 찾아 값 할당

 

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"
    import="java.util.*, jsp02.ex01.*"%>
<%
	request.setCharacterEncoding("utf-8");
%>	
<jsp:useBean id="memBean" class="jsp02.ex01.MemberBean" scope="page"></jsp:useBean>
<% 	String command = request.getParameter("command");
	
	MemberDAO dao = new MemberDAO();
	
	if (command!=null && command.equals("addMember")){
%>	
	
	<jsp:setProperty name="memBean" property="*" /> ////
	
<%		dao.addMember(memBean); 
	} else {
		String id = request.getParameter("id");
		dao.delMember(id);
	}
	List memberList = dao.listMembers(); 
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 목록</title>
</head>
<body>
	<table border="1" align="center">
		<tr align="center" bgcolor="beige">
			<td>아이디</td><td>비밀번호</td><td>이름</td><td>이메일</td><td>가입일</td><td>삭제</td>
		</tr>
	<%
		if(memberList.size()==0){
	%>
		<tr>
			<td colspan="5">등록된 회원이 없습니다</td>
		</tr>
	<%} else {
			for (int i=0;i<memberList.size();i++){
				MemberBean bean = (MemberBean) memberList.get(i);
	%>
		<tr>
			<td><%=bean.getId() %></td>
			<td><%=bean.getPwd() %></td>
			<td><%=bean.getName() %></td>
			<td><%=bean.getEmail() %></td>
			<td><%=bean.getJoinDate() %></td>
			<td><a href="/jsp02/member6.jsp?command=delMember&id=<%=bean.getId() %>">삭제</a></td>
		</tr>
	<%		}
		}
	%>
	</table>
</body>
</html>

 

 

 

 

  • getProperty

: useBean의 속성값 추출하는 태그

 


<jsp:setProperty name="자바 빈 이름" property="속성명" value="값"/>

 

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"
    import="java.util.*, jsp02.ex01.*"%>
<%
	request.setCharacterEncoding("utf-8");
%>	
<jsp:useBean id="memBean" class="jsp02.ex01.MemberBean" scope="page"></jsp:useBean>
<jsp:setProperty name="memBean" property="*" /> ////
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 목록</title>
</head>
<body>
	<table border="1" align="center">
		<tr align="center" bgcolor="beige">
			<td>아이디</td><td>비밀번호</td><td>이름</td><td>이메일</td><td>가입일</td>
		</tr>
		<tr>
			<td><jsp:getProperty property="id" name="memBean"/></td> // memBean 객체의 id 속성값 get
			<td><jsp:getProperty property="pwd" name="memBean"/></td>
			<td><jsp:getProperty property="name" name="memBean"/></td>
			<td><jsp:getProperty property="email" name="memBean"/></td>
			<td><jsp:getProperty property="joinDate" name="memBean"/></td>
		</tr>
	</table>
</body>
</html>

 

 

 

 

표현 언어 (EL, Expression Language)
  • JSP 발전 과정

HTML 태그 중심으로 자바 이용

액션 태그 등장

스크립트 요소보다 표현언어, JSTL 위주로 구현

 

 

 

 

  • 표현 언어

기존 표현식보다 편리하게 값 출력
변수와 여러 연산자 포함
JSP 내장객체에 저장된 속성 / 자바 빈 속성 => 표현 언어에서 출력 가능
표현언어 자체 내장객체 제공
( JSP 페이지 생성 시 기본설정은 표현언어 사용 불가 (페이지 디렉티브 태그 - isELIgnored=false 설정해야 함) ) ==> TOMCAT10은 가능

 

 

${표현식 or 값}

 


1. 산술연산자 : + = * / (또는 div) %(mod)
2. 비교연산자 : ==(eq) !-(ne) >(gt) >=(ge) <(lt) <=(le)
3. 논리연산자 : &&(and) ||(or) !(not)
4. empty 연산자 : 값이 null이거나 빈 문자열일 때 true 반환

 

 

 

  • 산술연산자
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>표현 언어에서 사용하는 데이터들</title>
</head>
<body>
	<h1>표현 언어로 여러 데이터 출력</h1>
	<h2>
		\${150} : ${150} <br>
		\${20+40} : ${20+40}  <br>
		\${"안녕하세요"} : ${"안녕하세요"} <br>
		\${"50"+3} : ${"50"+3} <br>
		\${null+10} : ${null+10} <br>
		<%-- \${"안녕"+30} : ${"안녕"+30} // 문자 + 숫자 => 오류 --%>
		<%-- \${"철수"+"영희"} : ${"철수"+"영희"} // 문자 + 문자 => 오류 --%>
		\${50-15} : ${50-15} <br>
		\${50*15} : ${50*15} <br>
		\${50/15} : ${50/15} <br>
		\${50 div 15} : ${50 div 15} <br>
		\${50 % 15} : ${50 % 15} <br>
		\${50 mod 15} : ${50 mod 15} <br>
	</h2>
</body>
</html>

//
표현 언어로 여러 데이터 출력
${150} : 150
${20+40} : 60
${"안녕하세요"} : 안녕하세요
${"50"+3} : 53
${null+10} : 10
${50-15} : 35
${50*15} : 750
${50/15} : 3.3333333333333335
${50 div 15} : 3.3333333333333335
${50 % 15} : 5
${50 mod 15} : 5

 

 

 

  • 비교연산자, 논리연산자
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>여러가지 비교 연산자</title>
</head>
<body>
	<h2>여러가지 비교 연산자</h2>
	<h3>
		\${20==20} : ${20==20}<br>
		\${20 eq 20} : ${20 eq 20}<br>
		\${"banana"!="apple"} : ${"banana"!="apple"}<br>
		\${20 ne 20} : ${20 ne 20}<br>
		\${(10==10)&&(50==50)} : ${(10==10)&&(50==50)}<br>
		\${!(10==10)} : ${!(10==10)}<br>
	</h3>
</body>
</html>

//
여러가지 비교 연산자
${20==20} : true
${20 eq 20} : true
${"banana"!="apple"} : true
${20 ne 20} : false
${(10==10)&&(50==50)} : true
${!(10==10)} : false

 

 

 

 

JSTL (JSP Standard Tag Library)

: 자주 사용되는 커스텀 태그들을 모아서 표준으로 모은 태그 라이브러리

=> 액션태그/표현언어 사용 시 여전히 조건식/반복문에서는 자바코드 사용 
=> 자바코드 제거 위해 등장함