사용자 정보수정 - 삭제 후 그리드 리로드(체크박스유지) -> 16.12.15 수정

2명 이상의 사용자 정보수정을 했을시 사용자 한명의 정보를 삭제

function  nextUserUpdateModalMult(list, modalTitle, cnt, selCount,rowid){
.
.
.
 
사용자를 삭제하면은 그 사용자에관한 rowid도 삭제를 해서 팝업창을 리로드 해야함 

 
    $("#deleteModel").click(function(){
        var DCODE = list[cnt].dcode;
        // 삭제할 rowid를 배열에서 삭제
        var arr =  $.grep(rowid, function(el){   // 배열의 원소수만큼 반복   // el은 배열의 각각의 원소
                console.log("el "+el);               
                return  el != rowid[cnt]; // 현재 rowid와 원소 배열이 같지 않은 값들만 저장
        });

        userDelete(DCODE,arr);
        $("#close").click();
    });
};

//사용자 정보수정 - 삭제
function userDelete(DCODE,arr){
    console.log("userDelete "+DCODE);
    if(confirm("정말 삭제하시겠습니까??") == true){
        $.ajax({
            type : "POST",
            url : "/library/userViewDelete.do",
            dataType : "html",
            async : true,
            data : {"DCODE":DCODE},
            contentType : "application/json",
            complete: function(){
                
                var rowid = arr;  //arr을 rowid로 변수명을 변경
                var dcode = new Array();
                for (var i = 0; i < rowid.length; i++) {
                    rows = JSON.stringify($("#list2").getRowData(rowid[i]));
                    dcode.push(JSON.parse(rows).dcode);
                }
               
                 userUpdateModalMult(dcode,rowid); // 사용자 정보수정 폼으로 돌아가기 (리로드)
                

              // 그리드 리로드(체크박스유지)
                $("#list2").jqGrid('setGridParam', {
                    gridComplete : function() {
                               for (var i = 0; i < rowid.length; i++) { //row id수만큼 실행           
                                   $("input:checkbox[id='jqg_list2_"+rowid[i]+"']").prop("checked", true);
                                   $("#"+rowid[i]+"").attr("class", "jqgrow ui-row-ltr ui-widget-content ui-state-highlight");
                                 }
                    }
                }).trigger("reloadGrid");

                
            }
        });
    } else { // 취소
        
        return;
    }
    
}

위에서는 12/7일에 완성한 사용자 정보수정 - 삭제 후 그리드 리로드(체크박스유지) 이다.

그런데 에러가 발생하였다.

예를들어 rowid 2,3,4 의 정보중 2번의 row를 지울때 지운 rowid의 값들이 하나씩 앞으로 당겨진다는것이다.! ==> 당연한건데 ㅜㅜ

(rowid:2,3,4 (dcode:11,22,34) 에서 2번row에 데이터를 지우면(dcode:11이 지워짐) 남은 dcode:22,34의 그리드에 체크가 되어야 하는데

로우번호가 하나씩 앞당겨져 row번호대로 그리드가 체크가 됨 )

아이디 328,329,33 중 329를 지운다고 했을때 328과33의 그리드체크가 유지되어야한다.

(rowid:1,2,3            2삭제시                   ==> rowid가 1과3중 2과 삭제되었으니 3번이였던 데이터가 2번이 되어야한다.)

그런데... 아래처럼 rowid대로 체크가 되었다.

16.12.15 수정

그래서 하루종일 머리싸매다가 이렇게 하였다 으어어어

삭제된 rowid의 값을 토대로 

2,3,4 번의 사용자 정보를 볼때

2번을 삭제하였으면 그 뒤 번호들은 2,3으로 변경되어야하고 == 3,4 ->2,3

3번을 삭제하였으면 2번은 그대로 놔두고 4번을 3번으로 == 2,4 -> 2,3

4번을 삭제하였으면 앞 번호들은 그대로 == 2,3 -> 2,3

이렇게 되어야 한다.

$("#deleteModel").click(function(){
        var DCODE = list[cnt].dcode;
        // 삭제할 rowid 배열에서 삭제
        
        var arr =  $.grep(rowid, function(el){   // 배열의 원소수만큼 반복   // el은 배열의 각각의 원소
                return  el != rowid[cnt]; // 현재 rowid와 원소 배열이 같지 않은 값들만 저장
        });
        
 
1.삭제한 rowid값을 저장

        //삭제할rowid 그리드 체크박스 유지를위하여
        var dRowid = rowid[cnt];

        userDelete(DCODE,arr,dRowid);
    });
};
 
 
function userDelete(DCODE,arr,dRowid){
    
    if(confirm("정말 삭제하시겠습니까??") == true){
        $.ajax({
            type : "POST",
            url : "/library/userViewDelete.do",
            dataType : "html",
            async : true,
            data : {"DCODE":DCODE},
            contentType : "application/json",
            complete: function(){
                
                var rid = arr;
                
                // 그리드 더블클릭 & 하나의 데이터 상세보기 - 삭제시
                if(rid.length==0){
                    $("#list2").jqGrid({  // jqGrid 리로드
                         url : '/library/gridView.do', 
                         datatype : 'json'}).trigger("reloadGrid"); 
                    $("#close").click();
 
                }else{
                    //다중상세보기 - 하나의 데이터 삭제시
                    
                    
                    var dcode = new Array();
                    //dcode추출
                    for (var i = 0; i < rid.length; i++) {
                        rows = JSON.stringify($("#list2").getRowData(rid[i]));
                        dcode.push(JSON.parse(rows).dcode);
                    }
 )
2-1.rowid 값 비교를 위해 형변환 (String ==> int)
                    dRowid = Number(dRowid);
 
                    //삭제후 바뀐 rowid 설정
                /*    삭제된 rowid (dRowid)기준으로 앞에 rowid는 놔두고 뒤에 rowid는 -1을 해줘야함
                    삭제된 rowid값보다 rowid값이 작으면 놔두기*/
                    
                    var rowid = new Array();
                    for(var i=0;i<rid.length;i++){

2-2.rowid 값 비교를 위해 형변환 (String ==> int)
                        a=Number(rid[i]);

                        if(dRowid>a){  // 삭제한 rowid보다 나머지 rowid중 작은 rowid는 아래문장을 건너뛰기


3.삭제한 rowid(dRowid)값이 rowid값보다 클 경우 그대루 담기 

                            rowid.push(a);

                            continue;}   // 아래 문장을 건너뛰기위하여
 
4.rowid를 하나씩 앞으로 당겨야 하니 rowid-1을 해준다. 
                        a = a-1;


5.형변환한 rowid를 다시 String형으로 변환 (int ==> String )
                        a = a.toString();
 
                        rowid.push(a);
                    }    ;                    
                    
                    $("#list2").jqGrid('setGridParam', {
                        gridComplete : function() {
                            for (var i = 0; i < rowid.length; i++) { //row id수만큼 실행           
                                $("input:checkbox[id='jqg_list2_"+rowid[i]+"']").prop("checked", true);
                                $("#"+rowid[i]+"").attr("class", "jqgrow ui-row-ltr ui-widget-content ui-state-highlight");
                                console.log("그리드리로드 rowid[i] "+rowid[i]);
                            }
                        }
                    }).trigger("reloadGrid");
                    
                    userUpdateModalMult(dcode,rowid);
                }
            }
        });
    } else { // 취소
        
        return;
    }
    
}

자바스크립트는 형 을 선언해주지않고 그냥 변수를 선언하기때문에 떄에따라 형변화을 해줘야 한다.

 

rowid를 -1을 해야 하는 경우였는데 계속 NaN 이 뜨는것이다. (NaN: 숫자가 아니다.)

그래서 형변화을 해줘야하나 하고 찾아보니 형변환을 해줘야 했던것이다.

일단 무슨 타입인지를 확인했다.

typeof rowid  ==> String

rowid는 String형이였다.  그래서 수식 계산을 위하여 int 형으로 변환을 했다.

※ Number()  숫자형으로 변환을해주는 함수

rowid= Number(rowid);

typeof rowid  ==> Number

수식계산 완료 후 다시 String로 형변환

※ toString()  문자형으로 형변환을 해주는 함수 

rowid = rowid.toString();

typeof rowid  ==> String