1.db에 저장된 데이터 불러와서 화면에 뿌리기
2. 수정된 정보를 db에 저장하고 그리드 리로드하기
1.db에 저장된 데이터 불러와서 화면에 뿌리기
1-1. 선택한 셀의 데이터를 불러온다.
(다중선택,선택된것이 없을때 거를 코딩포함)
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 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 | -eco_user.js // 사용자 정보 수정 - db데이터 가져오기 function userUpdate(){ //alert("userUpdate()"); var sel = $("#list2").getGridParam('selarrrow'); // selarrrow 배열 , selrow 하나만 선택 if(sel.length>1){ alert("수정할 데이터를 하나만 선택해주세요"); //modal닫기 /*$("#userUpdate").hide(); // 콘텐츠 레이어 감추기 $("#userUpdate"+"_overlay").hide();// 배경 레이어 감추기 */ }else if(sel.length == ""){ alert("수정할 데이터를 선택해주세요"); //modal닫기 }else if(sel.length>=1){ /* 처음에 위에 배열로 받아서 당연히 리스트로 controller에 보내야겟지? 라고 생각하고 for문돌려서 배열에 담음... * var arr = new Array(); * for (var i = 0; i < sel.length; i++) { * rows = JSON.stringify($("#list2").getRowData(sel[i])); * arr.push(JSON.parse(rows)); * } * console.log(arr); * console.log(JSON.stringify(arr)); * * 문제 1. 400번 에러 발생. * 문제해결 - 바보같이 dcode 배열로 받을때 처럼 controller에서 String[]이런식으로 받음 .. 그래서 에러가남... * //@RequestBody List<EmployeeVO> vo 이렇게 바꿔주니까 거지같은 400번에러가 해결됨 * 아마 주는곳에선 json형태의 리스트인데 받는곳은 그냥 string[] 이거여서 에러난듯함 ㅜㅜㅜㅜㅜ짜잉나!!!! * 게다가 리스트로 주면은 필요한 dcoed를 추출하기 힘듬 * //2016/10/28 중간정리 - 음.. dcode값만 추출해서 보내도 괜찮았을텐데 그떈 방법을 몰랐던거같다. 사용자조회 참고 * * * ====> 그래서 리스트로 받을 필요가 없음. 한 행에대한 정보면 오키 그래서 for문을 안함(배열로 담을 필요가 없다...) */ var row = JSON.stringify($("#list2").getRowData(sel)); // 선택한 셀의 데이터를 다 담아 보냄 var arr = JSON.parse(row) console.log("row : "+row); console.log("arr : "+arr); // 위에서 사용자 DCODE추출 후 에이작스를 통해 CONTROLLER에 전달해 사용자 삭제 후 JQGRID 리로드 $.ajax({ type : "POST", url:"/library/userUpdateSelect.do", dataType:"html", async:true, data:JSON.stringify(arr), contentType: "application/json", success: function (data){ // userUpdateSelect.do에서 return받은 emp 데이터 var emp = data; // controller에서 데이터를 리턴받아 userSelect로 보냄 userSelect(emp); console.log("10/26 emp :"+JSON.stringify(emp)); //JSON형태로 넘어옴 emp :{"dcode":"963","position":"신입".....} console.log("10/26 emp :"+JSON.parse(emp).ename); //10/26 emp :희란 이런식으로 형태를 바꿔서 출력 ㅇㅇ //alert("userUpdate 성공"); },error:function(request,status,error){ console.log("code:"+request.status+"\n"+"message:" +request.responseText+"\n"+"error:"+error); alert("실패"); alert(JSON.stringify(arr)); } }); } }//userUpdate() | cs |
1-2 Ajax로 던진 데이터를 controller에서 받아 로직수행 후 결과값 리턴
1234567891011121314151617181920212223 - controller//사용자 정보 수정 - 데이터 불러오기@RequestMapping(value = "/userUpdateSelect.do", method = RequestMethod.POST,produces = "application/json; charset=UTF-8")public @ResponseBody EmployeeVO userUpdateSelect(@RequestBody EmployeeVO vo) {// 데이터를 전부 다 보냈기 때문에 vo에 담음/* userUpdate() 에서 리스트로 던져줬을 경우*@RequestBody List<EmployeeVO> vo 이렇게 바꿔주니까 거지같은 400번에러가 해결됨* 아마 주는곳에선 json형태의 리스트인데 받는곳은 그냥 string[] 이거여서 에러난듯함 ㅜㅜㅜㅜㅜ짜잉나!!!!* 그런데 리스트로 받으면 필요한 dcode를 추출하기 힘듬 생각해보니 한 행에 정보만 필요한거니까* js 에서 for문 안돌리고 한줄에 대한 정보만 전송해서 emp로 받아 dcode 출력*/System.out.println(vo.toString()); // 데이터를 전부 다 보냈기 때문에 vo에 담음EmployeeVO emp = employeeServiceimp.EmployeeList(vo.getDCODE());System.out.println("emp :"+emp.toString());return emp; // 결과갑 리턴}cs
1-3. 리턴받은 데이터를 뷰 화면에 뿌린다.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354 function userSelect(emp){var user ={}; // user란 배열에 리턴받은 값들을 모두 담는다.user.UCODE = JSON.parse(emp).ucode;user.DCODE = JSON.parse(emp).dcode;user.ENAME = JSON.parse(emp).ename;user.NAME = JSON.parse(emp).name;user.BIRTHDAY = JSON.parse(emp).birthday;user.PHONE = JSON.parse(emp).phone;user.EXNUM = JSON.parse(emp).exnum;user.POSITION = JSON.parse(emp).position;user.EMAIL = JSON.parse(emp).email;user.ADDRESS = JSON.parse(emp).address;user.BIREDAY = JSON.parse(emp).bireday;user.PRESENT = JSON.parse(emp).present;user.NOTE = JSON.parse(emp).note;user.DEPARTMENT = JSON.parse(emp).department;//alert(typeof user.BIREDAY); // String// eco_userUpdatePopup.jsp에 넣기 // 하나하나 수동으로 넣기$("#UCODE").val(user.UCODE)$("#DCODE").val(user.DCODE);$("#ENAME").val(user.ENAME);$("#NAME").val(user.NAME);$(".BIRTHDAY_user").val(user.BIRTHDAY).daterangepicker({ //daterangepicker 날짜포멧singleDatePicker:true, //날짜포멧하기 귀찮 + 어차피 달력도 수정받아야 하니까~locale : { // 기본형태설정format : 'YYYY-MM-DD'},showDropdowns: true,});$("#PHONE").val(user.PHONE);$("#EXNUM").val(user.EXNUM);$("#POSITION").val(user.POSITION);$("#EMAIL").val(user.EMAIL);$("#ADDRESS").val(user.ENAME);$(".BIREDAY_user").val(user.BIREDAY).daterangepicker({singleDatePicker:true,locale : { // 기본형태설정format : 'YYYY-MM-DD'},showDropdowns: true,});$("#PRESENT").val(user.PRESENT);$("#NOTE").val(user.NOTE);$("#DEPARTMENT").val(user.DEPARTMENT);} //userSelect(emp)
2. 수정된 정보를 db에 저장하고 그리드 리로드하기
2-1. 수정창에 수정된 정보들 가져오기.
1234567891011121314151617181920212223242526 <form action="userUpdate.do" method="post" class="USER_update" id="USER_update">~~</form>function userUpdateReload(){var params = jQuery("#USER_update").serialize(); // serialize() : 입력된 모든Element(을)를 문자열의 데이터에 serialize 한다.console.log(params);$.ajax({url: '/library/userUpdate.do',type: 'POST',data:params,contentType: 'application/x-www-form-urlencoded; charset=UTF-8',dataType: 'html',success: function(){//alert("성공");$("#list2").jqGrid({ // jqGrid 리로드url : '/library/gridView.do',datatype : 'json'}).trigger("reloadGrid");},error:function(request,status,error){console.log("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);alert("실패");}});}cs
2-2 전달받은 정보를 저장하기.
12345678910 @RequestMapping(value = "/userUpdate.do", method = RequestMethod.POST)public String userUpdate(EmployeeVO vo,Model model) {System.out.println("사용자정보수정 -post");System.out.println("userUpdate 잘온다잉 dcode :"+vo.toString());employeeServiceimp.userUpdate(vo);// 저장완료 후 그리드 리로드return null;}cs
'개발 > 개인' 카테고리의 다른 글
사용자 정보 수정, 상세보기 - modal창 제어(선택된데이터가 있을때 없을때) (0) | 2016.11.02 |
---|---|
사용자 정보 입력하기 - 유효성검사 추가,입력폼 reset (0) | 2016.11.02 |
사용자 정보 상세조회 (0) | 2016.11.01 |
사내도서대여시스템 - 사용자정보 조회1 (0) | 2016.10.28 |
사내도서대여시스템 - db값 조회해 jqGrid 뿌리기,입력,삭제 (0) | 2016.10.28 |
댓글