본문 바로가기
WEB Archive

[JSP] 회원 관리 실습 - 추가, 수정 폼

by universedevelope 2024. 8. 22.

MemberSelect.jsp  ▼▼▼ 메인화면

<%@page import="com.test.MemberDTO"%>
<%@page import="java.sql.Connection"%>
<%@page import="com.test.MemberDAO"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%
	MemberDAO member = new MemberDAO();
	StringBuffer str = new StringBuffer();
	 // 이스케이프 문법 : \"내용\"
    // ※ 자바스크립트에서 사용할 수 있는 
    //    따옴표의 종류 : ① "" ② '' ③ \"\"
    //  일반적으로 따옴표가 두 번 중첩되어 사용하게 되면
    //  ①과 ② 를 사용하면 된다.
    //  하지만, 따옴표가 세번 중첩되어 사용될 경우
    //  ③ escape 를 사용해야 한다.

	try
	{
		member.connection();
		for(MemberDTO dto : member.lists())
		{
			str.append("<tr>");
			str.append("<td>" + dto.getSid() +"</td>");
			str.append("<td>" + dto.getName() +"</td>");
			str.append("<td>" + dto.getTel() +"</td>");
			str.append("<td><a href='MemberUpdateForm.jsp?sid="+ dto.getSid() +"'><button type='button' class='btn01'>수정</button></a> <a href='javascript:memberDelete(" + dto.getSid()+", \"" + dto.getName()+"\")'><button type='button' class='btn02'>삭제</button></a> </td>");
			str.append("</tr>");
		}
	}
	catch(Exception e)
	{
		System.out.println(e.toString());
	}
	finally
	{
		try
		{
			member.close();	
		}
		catch(Exception e)
		{
			System.out.println(e.toString());
		}
	}
	
	
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>MemberSelect.jsp</title>
<link rel="stylesheet" type="text/css" href="css/MemberScore.css">
<script type="text/javascript">
	function memberDelete(sid, name)
	{
		//alert("번호 : " + sid + ", 이름 : " + name);
		//alert("1");
		var res = confirm("번호 : " + sid + ", 이름 : " + name + "\n이 회원의 정보를 정말 삭제하겠습니까??");
		alert(res);
	 	//alert(res);
	 	if(res)
	 		window.location.href="MemberDelete.jsp?sid="+sid;
	 		
	}
</script>
</head>
<body>

<div>
	<h1>회원 <span style="color: blue;">명단</span> 관리 및 출력 페이지</h1>
	<hr />
</div>

<div>
	<a href="MemberScoreSelect.jsp"><button type="button"> 회원 성적 관리 </button></a>
	<a href="MemberInsertForm.jsp" ><button type="button"> 신규 회원 등록 </button></a>
</div>

<div>
	<table class="table">
		<tr>
			<th style="width: 50px">번호</th>
			<th style="width: 100px">이름</th>
			<th style="width: 150px">전화번호</th>
			<th style="width: 200px">회원관리</th>
		</tr>
		<!-- <tr>
			<td>1</td>
			<td>희동이</td>
			<td>010-1111-1111</td>
			<td><a><button type="button" class="btn01">수정</button></a>
			    <a><button type="button" class="btn02">삭제</button></a>
			</td>
		</tr>
		<tr>
			<td>2</td>
			<td>도우너</td>
			<td>010-2222-2222</td>
			<td><a><button type="button" class="btn01">수정</button></a>
			    <a><button type="button" class="btn02">삭제</button></a>
			</td>
		</tr>
		<tr>
			<td>3</td>
			<td>마이콜</td>
			<td>010-3333-3333</td>
			<td><a><button type="button" class="btn01">수정</button></a>
			    <a><button type="button" class="btn02">삭제</button></a>
			</td>
		</tr> -->
		<%=str %>
		
	</table>
</div>


</body>
</html>

MemberInsertForm.jsp  ▼▼▼ 회원 입력 폼

<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>MemberInsertForm</title>
<link rel="stylesheet" type="text/css" href="css/MemberScore.css">
<script type="text/javascript">
	function memberSubmit()
	{
		alert("호출");
		var memberForm = document.getElementById("memberForm");
		
		var uName = document.getElementById("uName");
		var nameMsg = document.getElementById("nameMsg");
		
		nameMsg.style.display = "none";
		
		if (uName.value == "" || uName.value.indexOf(" ") != -1)
		{
			nameMsg.style.display = "inline";
			uName.focus();
			return;
		}
		memberForm.submit();
		
	}
	
	function memberReset()
	{
		alert("멤버리셋");
		var memberForm = document.getElementById("memberForm");
		var uName = document.getElementById("uName");
		var nameMsg = document.getElementById("nameMsg");
		
		nameMsg.style.display = "none";
		memberForm.reset();
		uName.focus();
	}
	
	
</script>
</head>
<body>


<div>
	<h1> 회원명단관리 및 입력 페이지</h1>
	<hr>
</div>

<div><a href="MemberSelect.jsp"><button type="button">회원 명단 관리</button></a></div>


<div>
	<!-- 회원 데이터 입력 폼 구성  -->
	<form action="MemberInsert.jsp" method="post" id="memberForm"> 
		<table>
			<tr>
				<th>이름(*)</th>
				<td><input type="text" id="uName" name="uName" /></td>
				<td><span class="errMsg" id="nameMsg">이름을 입력해야합니다.</span></td>
			</tr>
			<tr>
				<th>전화번호</th>
				<td><input type="text" id="uTel" name="uTel" /></td>
			</tr>
			
		</table>
		<br>
		<a href="javascript:memberSubmit()"><button type="button">입력하기</button></a>
		<a href="javascript:memberReset()"><button type="button">취소하기</button></a>
		<a href="memberSelect.jsp"><button type="button">목록으로</button></a>
	</form>
</div>

</body>
</html>

MemberUpdateForm.jsp  ▼▼▼ 회원 수정 폼

<%@page import="com.test.MemberDTO"%>
<%@page import="com.test.MemberDAO"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%
	request.setCharacterEncoding("UTF-8");
	String sid = request.getParameter("sid");
	String name = "";
	String tel = "";
	MemberDAO dao = new MemberDAO();
	try
	{
		dao.connection();
		MemberDTO dto = new MemberDTO();
		dto = dao.searchMember(sid);
		name = dto.getName();
		tel = dto.getTel();
		
	}
	catch(Exception e)
	{
		System.out.println(e.toString());
	}
	
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>MemberUpdateForm.jsp</title>
<link rel="stylesheet" type="text/css" href="css/MemberScore.css">
<script type="text/javascript">
	function memberSubmit()
	{
		//alert("호출");
		var memberForm = document.getElementById("memberForm");
		
		var uName = document.getElementById("uName");
		var nameMsg = document.getElementById("nameMsg");
		
		nameMsg.style.display = "none";
		
		if (uName.value == "" || uName.value.indexOf(" ") != -1)
		{
			nameMsg.style.display = "inline";
			uName.focus();
			return;
		}
		memberForm.submit();
		
	}
	
	function memberReset()
	{
		alert("멤버리셋");
		var memberForm = document.getElementById("memberForm");
		var uName = document.getElementById("uName");
		var nameMsg = document.getElementById("nameMsg");
		
		nameMsg.style.display = "none";
		memberForm.reset();
		uName.focus();
	}
	
	
</script>
</head>
<body>

<div>
	<h1> 회원명단관리 및 수정 페이지</h1>
	<hr>
</div>

<div><a href="MemberSelect.jsp"><button type="button">회원 명단 관리</button></a></div>


<div>
	<!-- 회원 데이터 수정 폼 구성  -->
	<form action="MemberUpdate.jsp?sid=<%=sid %>" method="post" id="memberForm"> 
		<table>
			<tr>
				<th>이름(*)</th>
				<td><input type="text" id="uName" name="uName" value="<%=name %>"/></td>
				<td><span class="errMsg" id="nameMsg">이름을 입력해야합니다.</span></td>
			</tr>
			<tr>
				<th>전화번호</th>
				<td><input type="text" id="uTel" name="uTel" value="<%=tel %>"/></td>
			</tr>
			
		</table>
		<br>
		<a href="javascript:memberSubmit()"><button type="button">수정하기</button></a>
		<a href="javascript:memberReset()"><button type="button">취소하기</button></a>
		<a href="memberSelect.jsp"><button type="button">목록으로</button></a>
	</form>
</div>

<br>





</body>
</html>
728x90
저작자표시 비영리 변경금지 (새창열림)

'WEB Archive' 카테고리의 다른 글

[JSP] 회원 성적 관리 실습 - 추가, 수정 폼  (0) 2024.08.22
[JSP] 데이터베이스 연결, 객체 구성, View 에서 호출  (0) 2024.08.22
[JSP] Member Score 구현  (0) 2024.08.22
[JSP] Score 구현  (0) 2024.08.22
[JSP] Member 구현  (0) 2024.08.22

관련글

댓글

티스토리툴바