728x90

 

boardDetailView

3rd times

3번째 반복 연습

머리에 박아두기!!

 

유레카

삭제 할려고 콘트롤러에 데이터 보낼 때, 삭제할 게시물 번호 외에도 해당 게시물에 파일이 있다면

파일명 데이터도 같이 보내야한다

즉 삭제할 게시물 번호와 해당 게시물 안에 있는 파일명을 컨트롤러로 보내줘야함

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>prac</title>

<style type="text/css">
	#boardDetailTable{ width:800px; margin:auto; border-collapse:collapse; border-left:hidden; border-right:hidden;}
	#boardDetailTable tr td{ padding: 5px;}
	.replyTable{margin: auto; width:500px;}
</style>

</head>
<body>

	<c:import url="../common/menubar.jsp"/>
	
	<h1 align="center">${board.boradId }번 글의 상세보기</h1>
	
	
	<form action="" method="post">
		<table>
			<tr>
				<th>번호</th>
				<td>
					<input type="hidden" name="boardId" value="${ board.boardId }">
					<input type="hidden" name="page" value="${ page }">
				</td>
			</tr>
			
			<tr>
				<th>제목</th>
				<td>
					${ board.boardTitle }
					<input type="hidden" name="boardTitle" value="${ board.boardTitle }">
				</td>
			</tr>
			
			<tr>
				<th>작성자</th>
				<td>
					${ board.nickName }
					<input type="hidden" name="nickName" value="${ board.nickName }">
				</td>
			</tr>		
			<tr>
				<th>작성날짜</th>
				<td>
					${ board.board CreateDate }
				</td>
			</tr>		
			<tr>
				<th>내용</th>
				<% pageContext.setAttribute("newLineChar", "\r\n"); %>
				<td>
					${fn:replace(board.boardContent, newLineChar, "<br>" }
					<input type="hidden" value="${ board.boardContent }" name="boardContent">
				</td>
				
			</tr>	
			
			<c:if test="${board.originalFileName != null }">	
				<tr>
					<th>첨부파일</th>
					<td>
						<a href="${pageContext.servletContext.contextPath }/resources/buploadFiles/${board.renameFileName}" download="${board.originalFileName }"> ${board.originalFileName }</a>
						<input type="hidden" name="renameFileName" value="${ board.renameFileName }">
						<input type="hidden" name="originalFileName" vlaue="${ board.originalFileName }">
					</td>
				</tr>
			</c:if>
			
			<!-- url변수선언 -->
			<c:url var="bdelete" value="bdelete.bo">
				<c:param name="bId" value="${ board.boardId }"/>
				<c:param name="renameFileName" value="${ board.renameFileName }"/>
			</c:url>
			<c:url var="blist" value="blist.bo">
				<c:param name="page" value="${ page }"/>
			</c:url>
			
			<!-- 로그인한 유저가 작성자라면, 수정삭제버튼 보이기 --> 
			<c:if test="${ loginUser.id eq ${ board.boardWriter }">
				<tr>
					<td colspan="2" align="center">
						<button type="button" onclick="locaiont.href='${ bupdate }'">수정하기</button>
						<button type="button" onclick="location.href='${ bdelete }'">삭제하기</button>
					</td>	
				</tr>
			</c:if>
			
			
		</table>
	</form>
	

</body>
</html>
728x90
반응형
728x90

 

 

페이징 처리(페이지네이션)

중간에 보고 있는 현재 번호(currentPage) 외에 이전(prev), 다음(next) 버튼이 따로 있고

이들은 currentPage번호보다 작거나 커야함

그리고 각각 1과 마지막 번호(maxPage)의 경우가 있어서 따로 <c:if>로 작성 해야하는 구조임. 구조파악 완료

 

<!-- 페이징 처리 -->
<tr align="center" height="20" id="buttonTab">
    <td colspan="6">
        <!-- [이전] -->
        <c:if test="${ pi.currentPage <= 1 }">
            [이전] &nbsp; <!-- 1페이지에서만 나오는 기호 설정. 마찬가지로 마지막페이지에서 나오는 기호도 따로 지정해줘야함 -->
        </c:if>
        <c:if test="${ pi.currentPage > 1 }">
            <c:url var="before" value="blist.bo">
                <c:param name="page" value="${ pi.currentPage - 1 }"/>
            </c:url>
            <a href="${ before }">[이전]</a>
        </c:if>

        <!-- 페이지 번호 -->
        <c:forEach var="p" begin="${ pi.startPage }" end="${ pi.endPage }">
            <c:if test="${ p eq pi.currentPage }">
                <font color="red" size="4"><b>[${ p }]</b></font>
            </c:if>
            <c:if test="${ p ne pi.currentPage }">
                <c:url var="pagination" value="blist.bo">
                    <c:param name="page" value="${ p }"/>
                </c:url>
                <a href="${ pagination }">${ p }</a> &nbsp;
            </c:if>
        </c:forEach>

        <!-- [다음] -->
        <c:if test="${ pi.currentPage >= pi.maxPage }">
            [다음]		<!-- 마지막 페이지에서만 나오는 기호 설정. 마찬가지로 첫페이지에서 나오는 기호도 따로 지정해줘야함 -->
        </c:if>
        <c:if test="${ pi.currentPage < pi.maxPage }">
            <c:url var="after" value="blist.bo">
                <c:param name="page" value="${ pi.currentPage + 1 }"/>
            </c:url>
            <a href="${ after }">[다음]</a>
        </c:if>

    </td>
</tr>
728x90
반응형
728x90

 

<c:url>로 var변수를 만들고, value에 해당 url을 넣고

이 var 변수를 다른 button type="button"에서 onclick으로 불러내기

기존 버튼 온클릭에서 url 직접 입력에서 다른 코드로 한번 더 해봄

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>

<link rel="stylesheet" type="text/css" href="${ pageContext.servletContext.contextPath }/resources/css/member-style.css"> 

<style>
	#myInfoTable td{text-align:center;}
</style>

</head>
<body>

	<c:import url="..common/menubar.jsp"/>
	
	<h1 align="center">'${ loginUser.name }'님의 정보 보기</h1>
	
	<div class="centerText">
		<table id="myInfoTable">
			<tr>
				<th>아이디</th>
				<td>${loginUser.id }</td>
			</tr>
			<tr>
				<th>이름</th>
				<td>${loginUser.name }</td>
			</tr>
			<tr>
				<th>닉네임</th>
				<td>${loginUser.nickName }</td>
			</tr>
			<tr>
				<th>성별</th>
				<c:if test="${loginUser.gender eq 'M' }">
					<td> 남성 </td>
				</c:if>
				<c:if test="${loginUser.gender eq  'F'}">
					<td> 여성 </td>
				</c:if>
			</tr>
			<tr>
				<th>나이</th>
				<td>${loginUser.age }</td>
			</tr>
			<tr>
				<th>이메일</th>
				<td>${ loginUser.email }</td>
			</tr>
			<tr>
				<th>전화번호</th>
				<td>${loginUser.phone }</td>
			</tr>
			<tr>
				<th>주소</th>
				<td>
					<c:forTokens var="ft" items="${loginUser.address }" delims="/" varStatus="vs">
						<c:if test="${vs.index eq 0 && ft >= '0' && ft <= '99999' }">
							(${ft })
						</c:if>
						<c:if test="${vs.index eq 0 && !(ft >= '0' && ft <= '99999')}">
							${ft }
						</c:if>
						<c:if test="${vs.index eq 1 }">
							${ft }
						</c:if>
						<c:if test="${vs.index eq 2 }">
							${ft }
						</c:if>
					</c:forTokens>
					
				</td>
			</tr>
			
			<tr>
				<td colspan="2"	align="center">
					<c:url var="mpwdUpdateView" value="mpwdUpdateView.me"/>
					<button type="button" onclick="${mpwdUpdateView}">비밀번호 수정</button>
					<button type="button" onclick="location.href='mupdateView.me'">정보수정</button>
					<c:url var="mdelete" value="mdelete.me"/>
					<button type="button" onclick="location.href='${ mdelete }'">회원탈퇴</button>
					<button type="button" onclick="home.do">시작페이지로</button>
				</td>
			</tr>
		</table>
	</div>




</body>
</html>
728x90
반응형
728x90

 

반복 반복

머리에 기억되도록 반복

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">

<title> practice </title>
<link rel="stylesheet" type="text/css" href="${pageContext.servletContext.contextPath }/resources/css/member-style.css">

</head>
<body>

	<c:import url="../common/menubar.jsp"/>
	
	<h1 align="center">${loginUser.name }님의 정보 수정</h1>
	
	<div class="centerText">
		<form action="mupdate.me" method="post">
			<table>
				<tr>
					<th>아이디</th>
					<td>${loginUser.id }<input type="hidden" name="id" value="${loginUser.id }"></td>
				</tr>
				<tr>
					<th>이름</th>
					<td><input type="text" name="name" value="${loginUser.name }"></td>
				</tr>
				<tr>
					<th>닉네임</th>
					<td><input type="text" name="nickName" value="${loginUser.nickName }"></td>
				</tr>
				<tr>
					<th>성별</th>
					<c:if test="${ loginUser.gender == 'M' }">
						<td>
							<input type="radio" name="gender" value="M" checked>남
							<input type="radio" name="gender" value="F">여
						</td>
					</c:if>
					<c:if test="${ loginUser.gender == 'F' }">
						<td>
							<input type="radio" name="gender" value="M">남
							<input type="radio" name="gender" value="F" checked>여
						</td>
					</c:if>
				</tr>
				<tr>
					<th>나이</th>
					<td><input type="number" name="age" value="${loginUser.age }" min="18" max="100"></td>
				</tr>
				<tr>
					<th>이메일</th>
					<td><input type="email" name="email" value="${loginUser.email }"></td>
				</tr>
				<tr>
					<th>전화번호</th>
					<td><input type="tel" name="phone" value="${ loginUser.phone }"></td>
				</tr>
				
				
				<c:forTokens var="ft" items="${ loginUser.address }" delims="/" varStatus="vs">
					<c:if test="${ vs.index eq 0 && ft >= '0' && ft <= '99999' }">
						<c:set var="post" value="${ ft }"/>
					</c:if>
					<c:if test="${ vs.index eq 0 && !(ft >= '0' && ft <= '99999') }">
						<c:set var="address1" value="${ ft }"/>
					</c:if>
					<c:if test="${ vs.index eq 1 }">
						<c:set var="address1" value="${ ft }"/>
					</c:if>
					<c:if test="${ vs.index eq 2 }">
						<c:set var="address2" value="${ ft }"/>
					</c:if>			
				</c:forTokens>
				
				<tr>
					<th>우편번호</th>
					<td>
						<input type="text" name="post" class="postcodify_postcode5" value="${ post }" size="6">
						<button type="button" id="postcodify_search_button">검색</button>
					</td>
				</tr>
				<tr>
					<th>도로명 주소</th>
					<td>
						<input type="text" name="address1" class="postcodify_address" value="${address1 }" size="30">
					</td>
				</tr>
				<tr>
					<th>상세 주소</th>
					<td>
						<input type="text" name="address2" class="postcodify_extra_info" value="${ address2 }" size="30">
					</td>
				</tr>
				
				
				<!-- jQuery와 Postcodify를 로딩한다. -->
				<script src="//d1p7wdleee1q2z.cloudfront.net/post/search.min.js"></script>
				<script>
					// 검색 단추를 누르면 팝업 레이어가 열리도록 설정한다.
					$(function(){
						$("#postcodify_search_butto").postcodifyPopUp();
					});
				</script>
				
				<tr>
					<td colspan="2" align="center">
						<input type="submit" value="수정하기">
						<c:url var="mdelete" value="${ loginUser.id }">
							<c:param name="id" value="${ loginUser.id}"/>
						</c:url>
						<button type="button" onclick="location.href='${ mdelete }'">탈퇴하기</button>
						<button type="button" onclick="location.href='home.do'">시작 페이지로</button>
					</td>
				</tr>
				
			</table>
		</form>
	</div>



</body>
</html>
728x90
반응형
728x90

 

내정보 수정페이지

 

<c:forTokens> 구분자

 

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">

<title>prac</title>

<link rel="stylesheet" type="text/css" 
href="${ pageContext.servletContext.contextPath }/resources/css/member-style.css">


</head>
<body>

	<c:import url="../common/menubar.jsp"/>
	
	<h1 align="center">${ loginUser.name }님의 정보 수정</h1>
	
	<div class="centerText">
		<form action="mupdate.me" method="post">
			<table>
				<tr>
					<th>아이디</th>
					<td>${loginUser.id }
					<input type="hidden" name="id" value="${loginUser.id }">
					</td>
				</tr>
				<tr>
					<th>이름</th>
					<td>
						<input type="text" name="name" value="${ loginUser.name }"></td> <!-- input text박스 안에 value값이 들어가있는 상태가 됨 -->
					</td>
				</tr>
				<tr>
					<th>닉네임</th>
					<td><input type="text" name="nickName" value="${loginUser.nickName }"></td>
				</tr>
				<tr>
					<th>성별</th>
					<c:if test="${loginUser.gender == 'M' }">
						<td>
							<input type="radio" name="gender" value="M" checked readonly>남
							<input type="radio" name="gender" value="F" readonly>여
						</td>
					</c:if>
					<c:if test="${loginUser.gender == 'F' }">
						<td>
							<input type="radio" name="gender" value="M" readonly>남
							<input type="radio" name="gender" value="F" checked readonly>여
						</td>
					</c:if>
				</tr>
				<tr>
					<th>나이</th>
					<td><input type="number" min="20" max="100" name="age" value="${ loginUser.age }"></td>
					<!-- input 타입넘버도 value로 안에 값을 넣어서 보여줄 수 있음 -->	
				</tr>
				<tr>
					<th>이메일</th>
					<td><input type="email" name="email" value="${loginUser.email }"></td>
				</tr>
				<tr>
					<th>전화번호</th>
					<td><input type="tel" name="phone" value="${loginUser.phone }"></td>
				</tr>
				
				
				<c:forTokens var="addr" items="${loginUser.address }" delims="/" varStatus="vs">
					<c:if test="${ status.index eq 0 && addr >= '0' && addr <= '99999' }">
						<c:set var="post" value="${ addr }"/>
					</c:if>
					<c:if test="${ status.index eq 0 && !(addr >= '0' && addr <= '99999') }">
						<c:set var="address1" value="${ addr }"/>
					</c:if>
					<c:if test="${ status.index eq 1 }">
						<c:set var="address1" value="${ addr }"/>
					</c:if>
					<c:if test="${ status.index eq 2 }">
						<c:set var="address2" value="${ addr }"/>
					</c:if>
				</c:forTokens>
				
				
				<tr>
					<th>우편번호</th>
					<td>
						<input type="text" name="post" class="postcodify_postcode5" value="${ post }" size="6">
						<button type="button" id="postcodify_search_button">검색</button>
					</td>	
				</tr>
				<tr>
					<th>도로명 주소</th>
					<td><input type="text" name="address1" class="postcodify_address" value="${ address1 }" size="30"></td>
				</tr>
				<tr>
					<th>상세주소</th>
					<td><input type="text" name="address2" class="postcodify_extra_info" value="${ address2 }" size="30"></td>
				</tr>
				
				
				<!-- jQuery와 Postcodify를 로딩한다. -->
				<script src="//d1p7wdleee1q2z.cloudfront.net/post/search.min.js"></script>
				<script>
					// 검색 단추를 누르면 팝업 레이어가 열리도록 설정한다.
					$(function(){
						$("#postcodify_search_button").postcodifyPopUp();
					});	
				</script>
					
				<tr>
					<td colspan="2" align="center">
						<input type="submit" value="수정하기"> <!-- value값이 버튼이 되서 나옴 -->
						<c:url var="mdelete" value="mdelete.me">
							<c:param name="id" value="${ loginUser.id }"/>
						</c:url>	
						<button type="button" onclick="location.href='${mdelete}'">탈퇴하기</button>
						<button type="button" onclick="location.href='home.do'">시작 페이지로</button>
					</td>
				</tr>
			</table>		
		</form>
	</div>


</body>
</html>
728x90
반응형
728x90

 

 

코딩 자체가 별다른 에너지가 들지 않게 계속 써서 익숙해지기

전체 구조파악하고 세부적인 코드 써보기 & 반복

머리 아프거나 하기 싫을 때 이렇게만 해도 집중이 되고,

코딩을 손에 놓지 않고 계속 실력 향상을 할 수 있다!

짜투리 시간에 하기도 좋음. 3-40분정도 걸린 듯

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>    
    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>

<script
  src="https://code.jquery.com/jquery-3.6.0.min.js"
  integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
  crossorigin="anonymous"></script>
  

<style>
	.nav{margin-left:auto; margin-right:auto; text-align:center;}
	.menu{
		disply:inline-block; background:$e4fc41; text-align:center;
		line-height:50px; width:150px; height:50px; border-radius:20px;
		margin-left:5%; margin-right:5%;
	}
	.menu:hover{background:#b0c903; font-weight:bolder; cursor:pointer;}
	a:link{color:black; text-decoration:none;}
	a:visited{color:black; text-decoration:none;}
	
</style>

</head>
<body>

	<!-- 메뉴바는 어느 페이지든 포함하고 있을 테니 여기서 contextPath 변수 값 만들기 -->
	<c:set var="contextPath" value="${pageContext.servletContext.contextPath }" scope="application"/>
	
	<h1 align="center">Let's do it!!</h1>
	<br>
	
	<div class="loginArea" align="right">
		<c:if test="${ empty sessionScope.loginUser }"> <!-- user가 로그인 안했으면 로그인하게 id,pw 보여주는 창 보여줌-->
			<form action="login.me" method="post">
				<table id="loginTable" style="text-align:center;">
					<tr>
						<td>아이디</td>
						<td><input type="text" name="id"></td>
						<td rowspan="2">
							<button id="loginBtn">로그인</button>
						</td>
					</tr>
					<tr>
						<td>비밀번호</td>
						<td><input type="password" name="pwd"></td>
					</tr>
					<tr>
						<td colspan="3">
							<button type="button" onclick="location.href='enrollView.me'">회원가입</button>
							<button type="button">아이디/비밀번호 찾기</button>
						</td>
					</tr>
				</table>
			</form>
		</c:if>
		
		<c:if test="${ !empty sessionScope.loginUser }"> <!-- user가 로그인했으면 정보 변경, 로그아웃 등 보여줌 -->
			<h3 align="right"> <!-- h3태그 안에 c core와 button태그를 넣은게 신기 -->
				<c:out value="${loginUser.name }님 환영합니다."/>
				<c:url var="myinfo" value="myinfo.me"/>
				<c:url var="logout" value="logout.me"/>
				<button onclick="location.href='${myinfo}'">정보보기</button> 
				<button onclick="location.href='${logout}'">로그아웃</button>	
								<!-- c:url에서 var변수로 지정한 것을 버튼클릭하면 이동하게만듬 -->		
			</h3>
		</c:if>
		
		<!-- 위처럼 c:url을 통해서 지정할 수도 있지만 지금까지 해왔던 것처럼 바로 href에 url을 넣어도 상관없음 -->
		<div class="menubar">
			<div class="nav">
				<div class="menu"><a href="home.do">Home</a></div>
				<div class="menu"><a href="blist.bo">게시판</a></div>
			</div>
		</div>
	</div>


</body>
</html>
728x90
반응형
728x90

 

<목표>

따라치되 최대한 안보고 코딩하기

코딩 익숙해지기

구조 분석

세부코드 안보고 쓸 수 있게 되기

 

반복이 살 길이다!!!!!!!

 

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">

<script src="${ contextPath }/resources/js/jquery-3.6.0.min.js"></script> 

<style>
	.nav{margin-left:auto; margin-right:auto; text-align:center;}
	.menu{
		display:inline-block; background:#e4fc41; text-align:center;
		line-height:50px; width:150px; height:50px; border-radius:20px;
		margin-left:5%; margin-right:5%;
	}
	.menu:hover{background:#b0c903; font-weight:bolder; cursor:pointer;}
	a:link{color:black; text-decoration:none;}
	a:visited{color:black; text-decoration:none;}
</style>

</head>
<body>

	<c:set var="contextPath" value="${ pageContext.servletContext.contextPath }" scope="application"/>
	
	<h1 align="center">first page & Spring</h1>
	<br>
	
	
	<div class="loginArea" align="right">
		<c:if test="${ empty sessionScope.loginUser }">	<!-- user가 로그인 안했으면 로그인하게 id,pw 보여주는 창 보여줌-->
			<form action="login.me" method="post">
				<table id="loginTable" style="text-align:center;">
					<tr>
						<td>아이디</td>
						<td><input type="text" name="id"></td>
						<td rowspan="2">
							<button id="loginBtn">로그인</button>
						</td>
					</tr>
					<tr>
						<td>비밀번호</td>
						<td><input type="password" name="pwd"></td>
					</tr>
					<tr>
						<td colspan="3">
							<button type="button" onclick="location.href='enrollView.me'">회원가입</button>
							<button type="button">아이디/비밀번호 찾기</button>"
						</td>					
					</tr>
				</table>
			</form>
		</c:if>
	
		<c:if test="${ empty sessionScope.loginUser }"> <!-- user가 로그인했으면 정보 변경, 로그아웃 등 보여줌 -->
			<h3 align="right"> <!-- h3태그 안에 c core와 button태그를 넣은게 신기 -->
				<c:out value="${ loginUser.name }님 환영합니다."/>
				<br>
				<c:url var="myinfo" value="myinfo.me"/>
				<c:url var="logout" value="logout.me"/>
				<button onclick="location.href='${myinfo}'">정보보기</button>
				<button onclick="location.href='${logout}'"	>로그아웃</button>
							<!-- c:url에서 var변수로 지정한 것을 버튼클릭하면 이동하게만듬 -->
			</h3>		
		</c:if>
	</div>
	

<!-- 위처럼 c:url을 통해서 지정할 수도 있지만 지금까지 해왔던 것처럼 바로 href에 url을 넣어도 상관없음 -->
	<div class="menubar">
		<div class="nav">
			<div class="menu"><a href="home.do">Home</a></div>
			<div class="menu"><a href="blist.bo">게시판</a></div>		
		</div>
	</div>


</body>
</html>

 

 

728x90
반응형
728x90

 

비밀번호 수정 폼

클론 코딩 & 구조 파악

손코딩으로 하나씩 익히기

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
	
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> prac</title>

<link rel="stylesheet" type="text/css" href="${pageContext.servletContext.contextPath }/resources/css/member-style.css"> 

</head>
<body>

	<c:import url="../common/menubar.jsp"/>

	<h1 align="center">비밀번호 수정</h1>
	
	<div class="centerText">
		<form action="mPwdUpdate" method="post">
			<table>
				<tr>
					<th>현재 비밀번호</th>
					<td><input type="password" name="pwd"></td>
				</tr>
				<tr>
					<th>새 비밀번호</th>
					<td><input type="password" name="newPwd1"></td>
				</tr>
				<tr>
					<th>새 비밀번호 확인</th>
					<td><input type="password" name="newPwd2"></td>
				</tr>
				<tr>
					<td colspan="2" align="center">
						<input type="submit" value="수정하기">
						<button type="button" onclick="location.href='home.do'">시작화면으로</button>
					</td>
				</tr>
				
			</table>
		</form>	
	</div>

</body>
</html>
728x90
반응형
728x90

 

페이징처리 뷰단 코드 써보기

손코딩

 

<!-- 페이징처리 tr -->
		<tr align="center" height="20" id="buttonTab">
			<td colspan="6">
				<!-- prev -->
				<c:if test="${ pi.currentPage <= 1 }">
					[이전] &nbsp;
				</c:if>
				<c:if test="${ pi.currentPage > 1 }">
					<c:url var="before" value="blist.bo">
						<c:param name="page" value="${ pi.currentPage - 1 }"/>
					</c:url>
					<a href="${ before }">[이전]</a>&nbsp;
				</c:if>
			
				<!-- 페이지번호 -->
				<c:forEach var="p" begin="${pi.startPage }" end="${pi.endPage }">
					<c:if test="${ p == pi.currentPage }">
						<font color="red" size="4"><b>[${p}]</b></font>
					</c:if>
					
					<c:if test="${ p ne pi.currentPage }">
						<c:url var="pagination" value="blist.bo">
							<c:param name="page" value="${ p }"/>
						</c:url>
					</c:if>
					<a href="${ pagination }">${p}</a> &nbsp;
				</c:forEach>
				<!-- next -->
				<c:if test="${pi.currentPage >= maxPage }">
					[다음]
				</c:if>
				<c:if test="${pi.currentPage < pi.maxPage }">
					<c:url var="after" value="blist.bo">
						<c:param name="page" value="${pi.currentPage + 1 }"/>
					</c:url>
					<a href="${ after }">[다음]</a>
				</c:if>
			</td>
		</tr>
728x90
반응형
728x90

 

 

 

 

1. getElementsByClassName("user")하면 span태그의내용 전체를 가져오는 것

2. for문으로 user.length가져오니까 위에있는 span태그 6개 정보 다 가져옴

3. user[i]에서 0번인덱스면 첫번째 span태그, 1번 인덱스면 두번째 span태그를 의미

4. user[i].innerText = name.value;에서 span태그의 name속성의 value(값)을 innerText로 텍스트값만 얻어옴

5. 4번에서 innerText로  추출된 데이터가 해당 인덱스 번호에 맞게 user[i]에 저장되고 최종적으로 var user에 담아지게 됨

ex) user[i]에 user[0]이면 첫번째 span태그의 name속성의 value(값)인 beverage가 user[0]에 저장되고 이게 최종적으로 var user변수에 저장됨

 

728x90
반응형

+ Recent posts