728x90
안녕하세요~
오늘도 퇴근하고 돌아온 jju_developer 입니다.
저는 백엔드 프런트엔드 둘다 맡고 있습니다.
메인은 백엔드지만 간단한 수정이나 페이지 제작은 직접 합니다!
그럼 오늘은 회원 수정 삭제 등록에 대해 간단하게 복습을 해보도록 하겠습니다~
현재는 아래와 같은 모양의 등록만 할 수 있는 페이지가 있습니다.
등록 페이지를 다 만들고 나서 보니까 기존 소스를 가져오고 추가, 삭제가 되어야 겠더라구요.
Spring MVC 패턴 기능 정리
기능 :
사용자 1명당 5명의 보호자를 지정하여
등록, 삭제, 수정이 가능하여야 한다.
- 컨트롤러 : 1개
- jsp 페이지 : 3개 1. 사용자 관리 페이지 (완성) - 사용자1 등록, 수정, 삭제 - 사용자2 등록, 수정, 삭제
2. 해당 사용자의 보호자 관리 페이지 (NEW 개발 항목)
- 어느 사용자의 보호자를 등록할것인지
-> 사용자 검색
- 전체 보호자 list 표출
- 전체 보호자 list 중에서 삭제, 수정
-> 삭제, 수정 페이지
3. 보호자 등록 페이지 (NEW 개발 항목)
- 사용자1의 보호자 list 표출
- 사용자1의 보호자 list 수정, 삭제
-> 삭제, 수정 페이지
3번만 이번에는 다루겠습니다!
사용자 한명을 검색했을때 여러명의 등록된 list 표출되는 방법입니다.
초기 등록 페이지 모습입니다.
자, 그럼 차근 차근 한번 봅시다.
td에 hidden 타입으로 updateYn이라는 name으로 태그를 하나 만들어 주었습니다
우선, 3번 기능을 먼저 해보겠습니다.
사용자를 검색했을때,
그에 맞는 사용자의 보호자 5명을 쭈루룩 나오게 해보겠습니다.
select 문을 만들어 봅시다.
1. userMng_SQL.xml 사용자에 맞는 보호자 List 를 가져오기
< selectGuardianMngList >
<select id="selectGuardianMngList" parameterType="java.util.Map" resultType="egovMap">
SELECT
A.GUARDIAN_ID,
A.BIZ_ID,
A.USER_ID,
A.GUARDIAN_NM,
A.GUARDIAN_TYPE,
A.MOBILE,
A.ADDR,
A.SORT_ORDER,
A.USE_YN,
A.REG_ID,
A.REG_DT,
A.UPD_ID,
TU.USER_NM,
D.CODE_NM GUARDIAN_TYPE_NM
FROM TB_EMERGENCY_CONTACTS A
INNER JOIN TB_USER TU ON A.BIZ_ID = TU.BIZ_ID AND A.USER_ID = TU.USER_ID
LEFT OUTER JOIN TB_CODE D ON A.GUARDIAN_TYPE = D.CODE_ID AND D.CODE_GRP_ID = '0008' AND D.CODE_ID != '00' AND D.USE_YN = 'Y'
WHERE 1=1
AND A.USE_YN = 'Y'
<if test='searchUserId != null and searchUserId != "" '>
AND A.USER_ID = #{searchUserId}
</if>
<if test='searchCustBizId != null and searchCustBizId != "" '>
AND A.BIZ_ID IN (SELECT Z.BIZ_ID
FROM V_BIZ_INFO Z
WHERE Z.BIZ_ID_SEARCH LIKE CONCAT('%', #{searchCustBizId}, '%')
AND Z.BIZ_TYPE = '02')
</if>
<if test='searchBizId != null and searchBizId != "" '>
AND A.BIZ_ID = #{searchBizId}
</if>
</select>
2. 등록 페이지에 사용자를 검색하면 보호자 5명이 나오도록 jsp 작성
2-1) jsp 에서 form 태그 아래에 searchUserId와 searchUserName을 만든다.
대상자 성명을 검색할때에 (사용자 검색) 하는 버든에 hidden태그 추가하여
검색한 사용자의 Id, name 값을 저장합니다.
<form:form commandName="frm" name="frm" method="post">
해당 폼태그에 그냥 post 라고 하면 안됩니다! 꼭 컨트롤러로 전달 될 수 있도록 action 지정하기!
이부분을 URL을 Controller와 동일하게 주어, name에 저장한 값들을 넘겨줍니다!
<form:form commandName="frm" name="frm" action="${pageContext.request.contextPath}/admin/manage/guardianMngDetail.do?gid=lm_07&mid=lm_07_05" method="post">
form 태그에 넣은게 Controller로 가서 value가 전달이 되는데...
이말이 무슨말인지 모르겠으면 아래 블로그 참고해주세요~!
[java] HttpServletRequest 로 여러개의 값을 jsp 값 받아와서 DB에 저장하기
안녕하세요~~~ 오늘도 퇴근하고 돌아온 jju_developer입니다!! jsp에서 한명의 사용자 정보가 아닌,여러명의 사용자 정보를 받고 나서 한번에 저장을 하려고 하는데용! java로 값을 넘겨줄때 사용하
jju240.tistory.com
2-1) 자바스크립트로 사용자를 검색했을때 보호자 디테일 리스트가 출력되도록 한다.
저는 사용자 userListPop.jsp에 사용자를 선택하면 아래와 같은 버튼을 누르게 됩니다.
<td>
<button type="button" class="btn btn-info btn-sm m-0" onclick="javascript:setUserInfo('${result.userId}', '${result.userNm }')" data-dismiss="modal">선택</button>
</td>
여기에 있는 setUserInfo가 바로
guardianMngRegist.jsp 에 지정을 해주었습니다.
// SET USER INFO
function setUserInfo(userId, userNm){
$("#searchUserId").val(userId);
$("#searchUserNm").val(userNm);
selectList();
}
2-1) 사용자 검색을 완료한 후, 보호자 리스트 출력하는 xml을 표출해준다.
<div class="main-body dashboard">
<div class="page-wrapper">
<!-- [ Main Content ] start -->
<form:form commandName="frm" name="frm" action="${pageContext.request.contextPath}/admin/manage/guardianMngDetail.do?gid=lm_07&mid=lm_07_05" method="post">
<div class="card">
<div class="card-header point py-3">
<div class="d-flex justify-content-between align-items-center">
<div class="d-flex align-items-center">
<h5 class="fs-18 font-bold color-default mr-5">보호자 등록 페이지</h5>
</div>
<div class="d-flex justify-content-between align-items-center">
<button class="btn btn-gray btn-small lh-100 mr-2" onclick="backList()">돌아가기</button>
<button class="btn btn-primary btn-small lh-100 mr-4" onclick="saveDB()">저장</button>
<button type="button" class="btn btn-primary btn-wide-lg" data-toggle="modal" data-target="#alertMsgPop" style="display:none" id="alertMsgBtn">알림메시지</button>
<button type="button" class="btn btn-primary btn-wide-lg" data-toggle="modal" data-target="#alertConfirmPop" style="display:none" id="alertConfirmBtn">알림메시지</button>
</div>
</div>
</div>
<div>
<div class="form-row col-md-4">
<label for="searchUserNm" class="col-lg-4 col-sm-12 col-form-label lg-text-center">대상자 성명 검색</label>
<div class="col-lg-8">
<div class="icon-search-wrap">
<input type="hidden" id="searchUserId" name="searchUserId" value="<c:out value='${commandMap.searchUserId}'/>"/>
<input type="text" class="form-control" id="searchUserNm" name="searchUserNm" value="${commandMap.searchUserNm }" placeholder="돋보기를 클릭하여 사용자를 선택하세요" readonly>
<a href="#" onclick="javascript:userSearchPop('1','','')" class="icon-search-btn" data-toggle="modal" data-target="#popupArea"><i class="font-15 feather icon-search"></i></a>
</div>
</div>
</div>
</div>
<div class="card-block">
<input type="hidden" id="pageIndex" name="pageIndex" value="<c:out value='${commandMap.pageIndex}'/>"/>
<input type="hidden" id="cmd" name="cmd" value="<c:out value='${commandMap.cmd}'/>"/>
<input type="hidden" id="searchBizId" name="searchBizId" value="<c:out value='${commandMap.searchBizId}'/>"/>
<input type="hidden" id="bizId" name="bizId" value="<c:out value='${commandMap.searchBizId}'/>"/>
<!-- TODO OGJ: 보호자 추가 페이지 시작 -->
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label for="installType">보호자 정보</label>
<button type="button" class="btn btn-rounded btn-info btn-sm" style="float:right;margin-bottom: 10px" onclick="addSectionGard()">보호자 추가</button>
<div class="table-responsive">
<table class="table table-striped table-hover">
<colgroup>
<col style="width: 15%">
<col style="width: 20%">
<col style="width: 15%">
<col style="width: 20%">
<col style="width: 20%">
</colgroup>
<thead>
<tr>
<th rowspan="2" class="inteTh">정렬순서</th>
<th rowspan="2" class="inteTh">성명</th>
<th rowspan="2" class="inteTh">보호자 타입</th>
<th rowspan="2" class="inteTh">전화번호</th>
<th colspan="2" class="inteTh">주소</th>
<th rowspan="2" class="inteTh">삭제</th>
</tr>
</thead>
<tbody id="guardianList">
<c:forEach var="result" items="${selectGuardianMngList}" varStatus="status">
<tr>
<td>
<input type="text" class="form-control form-control-lg" id="sortOrder" name="sortOrder" value="${result.sortOrder}" oninput="this.value = this.value.replace(/[^0-9]/g, '').replace(/(\..*)\./g, '');">
<input type="hidden" value="N" name="updateYn"/>
<c:if test="${commandMap.cmd == 'update'}">
<input type="hidden" class="form-control form-control-lg" id="guardianId" name="guardianId" value="${result.guardianId}" disabled>
</c:if>
</td>
<td>
<input type="text" class="form-control form-control-lg" id="guardianNm" name="guardianNm" value="${result.guardianNm}" maxlength="50">
</td>
<td>
<select id="guardianType" name="guardianType" class="form-control">
<c:forEach var="result2" items="${guardianTypeList}" varStatus="status">
<option value="<c:out value='${result2.codeId}'/>" ${uifunc:getSelected(result.guardianType, result2.codeId)}><c:out value='${result2.codeNm}'/></option>
</c:forEach>
</select>
<!-- <span>
복지사 : 문자 긴급알림 O, ARS 전화<br>
보호자 : 문자 알림 O <br>
</span> -->
</td>
<td>
<input type="text" class="form-control form-control-lg" id="mobile" name="mobile" maxlength="13" oninput="autoHyphen(this)" placeholder="숫자만 입력해주세요" value="${result.mobile}">
</td>
<td colspan="2">
<input type="text" class="form-control form-control-lg" id="addr" name="addr" value="${result.addr}">
</td>
<td><button type="button" class="btn btn-danger btn-sm m-0 btn_deleteSensorItem">삭제</button></td>
</tr>
</c:forEach>
<c:if test="${fn:length(selectGuardianMngList) eq 0}">
<tr class="nodata">
<td colspan="10"><p class="nodata">등록된 데이터가 없습니다</p></td>
</tr>
</c:if>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</form:form>
<!-- [ Main Content ] end -->
</div>
</div>
! 요약 !
updateYn은 다음시간에 볼 예정!
3. 보호자 등록 UserMngController.java
/**
* * 사용자 한명당 여러명의 보호자 정보를 검색 한다.
* @autor OGJ
* 상세조회를 한다.
* @param commandMap
* @return 조회한 정보
* @exception Exception
*/
@RequestMapping(value = "/admin/manage/guardianMngDetail.do")
public String guardianMngDetail(@RequestParam Map<String, Object> commandMap, ModelMap model) throws Exception {
// 사용자 1명의 보호자 리스트 표출 | 보호자 정보 수정시
// 보호자 리스트 출력 쿼리
if (commandMap.get("searchUserId") != null && !commandMap.get("searchUserId").equals("")) {
model.addAttribute("selectGuardianMngList", userMngService.selectGuardianMngList(commandMap));
}
// 상태코드 데이터는 최상위 기관에 있기 때문에 최상위 bizId setting
commandMap.put("searchTopBizId", EgovUserDetailsHelper.getTopBizId());
// 권한관리 추가 - 끝 --------------------------------------------------------------
// 사용자 타입 코드
model.addAttribute("guardianTypeList", codeService.selectCodeList("0041"));
// 사용자 검색시, 워치 매핑자만 찾는다.
commandMap.put("deviceType", "01");
// 사용자 이름 검색
model.addAttribute("userMngList", deviceMappingService.selectUserList(commandMap));
// commandMap에 사용자Id 있음
model.addAttribute("commandMap", commandMap);
return "admin/manage/userMng/guardianMngRegist";
}
1. 검색한 사용자의 id 를 commandMap에 담아서
2. 사용자 1명당 보호자 리스트 검색시 commandMap을 전달해줘서
쿼리문 가져올때에 사용자searchid와 그 외 파라미터들을 보내줍니다.
3. model.addAttribute("selectGuardianMngList", userMngService.selectGuardianMngList(commandMap));
모델에 담아서 전달하면 끝!
728x90
'주니어 기초 코딩공부 > JSP 기초' 카테고리의 다른 글
| [jsp] 회원 수정 삭제 2편 코드 완벽 정리 (0) | 2024.07.02 |
|---|---|
| [jsp] 로그인시 비밀번호 표시하는 로직 완벽정리 (0) | 2024.07.02 |
| [JSTL] 비교 연산할 때 소수점 없애기 formatNumber (0) | 2023.11.08 |
| JSP C태그_<c:out value="${값}"/> (0) | 2023.08.03 |
| [JSP] ★게시판 만들기★ (0) | 2023.02.01 |