개발/개인

사용자 정보 수정, 상세보기 - modal창 제어(선택된데이터가 있을때 없을때)

areumtb 2016. 11. 2. 11:57

사용자 정보 수정, 상세보기 창에서 데이터가 선택되지 않았거나 하나 이상에 데이터가 선택되었을때

알럿창 생성 후 modal창이 안뜨게 하기.

(사용자 정보 입력창을 참고함 )



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
- 원래 userSearch.jsp 소스
<button type="button" data-toggle="modal" data-target="#userView"
                        onclick="userView()" class="btn">상세보기</button>
                    <div class="modal fade" id="userView" role="dialog">
                        <div class="modal-dialog">
                            <jsp:include page="/WEB-INF/views/user/userViewPopup.jsp" />
                        </div>
                    </div>
                    
                    <button type="button" data-toggle="modal" data-target="#userUpdate" 
                    onclick="userUpdate()"class="btn" data-dismiss="modal">수정</button>
                               <div class="modal fade" id="userUpdate" role="dialog">
                                <div class="modal-dialog">
                                    <jsp:include page="/WEB-INF/views/user/userUpdatePopup.jsp" />
                                </div>
                             </div>
cs





1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
- 변경된 userSearch.jsp 소스


<button type="button" data-toggle="modal" data-target=""
                        onclick="userView()" class="btn">상세보기</button>
                    <div class="modal fade" id="userView" role="dialog">
                        <div class="modal-dialog">
                            <jsp:include page="/WEB-INF/views/user/userViewPopup.jsp" />
                        </div>
                    </div>
                    
                    <button type="button" data-toggle="modal" data-target="" 
                    onclick="userUpdate()"class="btn" data-dismiss="modal">수정</button>
                               <div class="modal fade" id="userUpdate" role="dialog">
                                <div class="modal-dialog">
                                    <jsp:include page="/WEB-INF/views/user/userUpdatePopup.jsp" />
                                </div>
                             </div>
cs



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
//사용자  상세보기
function userView(){
        
    
    var sel = $("#list2").getGridParam('selarrrow'); // selarrrow 배열 , selrow 하나만 선택
    
// 그리드 체크박스 체크해제
    $("#list2").jqGrid('resetSelection');

// 먼저 상세보기을 실행했을때 23줄에서 바꿔준 값을 그대로 가지고 있어서 초기화를 한번 해줘야함(11/02)
    $("#userView_Btn").attr("data-target",""); 
    
 
 
 
    if(sel.length>1){
        alert("데이터를 하나만 선택해주세요");
    }else if(sel.length == ""){
        alert("데이터를 선택해주세요");
        
    }else if(sel.length>=1){
        
        $("button[type='button']").attr("data-target","#userView"); 
        
~
 
cs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// 사용자 정보 수정 - db데이터 가져오기
function userUpdate(){
    var sel = $("#list2").getGridParam('selarrrow'); // selarrrow 배열 , selrow 하나만 선택
    
 
    
    // 그리드 체크박스 체크해제
    $("#list2").jqGrid('resetSelection');
 
    // 먼저 수정을 실행했을때 24줄에서 바꿔준 값을 그대로 가지고 있어서 초기화를 한번 해줘야함(11/02)
    $("#userUpdate_Btn").attr("data-target",""); 
    
    if(sel.length>1){
        
        alert("수정할 데이터를 하나만 선택해주세요");
        
        
    }else if(sel.length == ""){
        alert("수정할 데이터를 선택해주세요");
 
    }else if(sel.length=1){
        
        //modal창 띄우기 위해 data-target에 #userUpdate을 줌
        $("#userUpdate_Btn").attr("data-target","#userUpdate"); 
        
cs



상세보기 , 수정하기 둘다 체크된 cell의 값이 1이면 data-target에 값을 주는걸로 바꿈


※ 문제가 발생한게 상세보기, 입력. 수정을 한번씩 실행하고 나면은 바뀐 data-target 값이 그대로 남아있음

   그래서 다시 빈칸으로 변경해 줘야함 그래서 빈칸으로 돌려주는 부분을 추가 (11/02)


저작자표시 (새창열림)