초급 개발자 mylee 개발 노트

## 문제 상황게시글 수정 시 기존 첨부파일을 삭제해도 atchFileId 값이 계속 남아있어서,파일이 없는데도 DB에 atchFileId가 들어가는 현상 발생 ## 원인 분석1. 파일 정보가 저장되는 방식:// hidden input에 파일 ID 저장// 각 파일행의 숨겨진 div에 파일 상세 정보 저장  2. 삭제 버튼 클릭 시 파일명만 초기화하고 atchFileId는 그대로 남아있었음$(".btn_delete").click(function() { var row = $(this).closest("tr"); row.find('input[name="fileName"]').val(""); // 파일명만 초기화 row.find('.file-info').html(""); // 파일 정보는 ..

오늘 헷갈린 내용 정리 노트 ## 기본 구조   ### MyBatis Mapper - 동적 정렬을 위해 `` 태그 활용 - 기본적으로 `REG_DT` 내림차순 정렬 ORDER BY BOARD_COUNT BOARD_TITLE USER_NM REG_DT REG_DT DESC ASC ORDER BY REG_DT DESC   ### jqGridbeforeRequest 이벤트 핸들러로 정렬 파라미터 추가$("#boardTable").jqGrid({ beforeRe..

오늘 댓글 수정/등록 기능 구현하다가 this 때문에 발생한 TroubleShooting 정리...🤔   # 문제상황 처음에 이렇게 작성했는데 this가 undefined로 나옴// 수정/등록 버튼 클릭 이벤트$("#btnSaveEdit").on("click", function(e) { saveComment(true); // 수정 모드});$("#btnSave").on("click", function(e) { saveComment(false); // 신규 작성 모드});// 댓글 저장 함수function saveComment(isEdit) { var content = isEdit ? $(this).closest("tr").find(".comment-edit").val(..

오늘 댓글 삭제 기능 구현하다가 생긴 TroubleShooting 정리...🥲   # 문제상황 댓글 삭제 버튼에 이벤트를 아래처럼 걸었는데 아무리 눌러도 반응이 없었다.$("#btnDelete").on("click", function(e){ var commentIdx = $(this).closest("tr").find("input[name='commentIdx']").val(); if(!commentIdx){ alert("댓글을 찾을 수 없습니다."); return; } location.href = "/comment/delete/" + commentIdx;});  # 원인알고보니 동적으로 생성된 요소에는 이벤트가 바인딩이 안 되는 문제였다.페이지 로드 시점..

테이블에서 행 추가/삭제하는 기능 드디어 구현 성공했다.특히 첨부파일 여러 개 업로드하는 부분에서 행을 추가하고 체크박스로 삭제하는 기능이 필요했는데, jQuery로 해결했다. 1. 기본 HTML 구조: 순번 내용 1 행 추가선택 삭제   2. jQuery로 구현한 핵심 기능들:2-1. 행 추가 기능fu..

오늘 파일 업로드 기능 구현하다가 생긴 트러블 슈팅 정리 파일 업로드할 때 popup window 써서 처리하려니 이벤트 흐름 파악이 중요했음.  1. 기본 구조 btnFileUpload 버튼 클릭 → eventFileUpload 함수 호출 → _setUploadWindow로 팝업 오픈 → 팝업에서 파일 선택 후 확인 → _setFileUploadSendResult 콜백으로 결과 받음  2. 실제 구현 $(document).on("click", "[id^='btnFileUpload']", function(e) { var rowIndex = $(this).closest("tr").index(); // 현재 행 인덱스 eventFileUpload(rowIndex); e.preventDef..

1. 페이징 처리의 핵심 요소1.1 jqGrid 페이징 파라미터page: 현재 페이지 번호rows: 한 페이지당 표시할 행 수sidx: 정렬 기준 컬럼sord: 정렬 방향 (asc/desc)_search: 검색 여부total: 전체 페이지 수records: 전체 레코드 수1.2 핵심 클래스 구조public class BoardVO { private int page = 1; // 현재 페이지 private int rows = 20; // 페이지 사이즈 private String sidx; // 정렬 컬럼 private String sord; // 정렬 방향 // jqGrid 페이징용 offset 계산 public int getOffset..

1. 컨트롤러로 값이 안 넘어가는 문제처음 시도했던 코드:function search() { var params = { title: $("#title").val(), content: $("#content").val(), writer: $("#writer").val(), fromDate: $("#fromDate").val(), toDate: $("#toDate").val() }; $("#grid").jqGrid('setGridParam', { url: "/board/search", postData: params, page: 1 }).trigger("reloadGrid");}   ajax..

⚠️ 오늘 발생한 문제들1. 데이터가 안 나오고 자꾸 "게시물이 없습니다" 뜸개발자도구 보니까 500 에러 발생원인: 컨트롤러에서 @RequestBody 때문이었음jqGrid는 form 데이터로 보내는데, 컨트롤러는 JSON만 받으려고 해서 충돌// 이렇게 했다가 실패@RequestBody BoardVO boardVO // JSON만 받으려고 함// 이렇게 수정하니까 됨BoardVO boardVO // 그냥 일반 파라미터로 받기   2. 데이터는 오는데 화면에 안 보임서버 로그 찍어보니 데이터는 잘 나오는데 화면에서 안 보임원인: jqGrid는 rows라는 키로 데이터를 찾는데, 서버는 list로 보내고 있었음// 서버에서 보내는 데이터{ "list": [ { "..

e.switch는 jQuery 이벤트 객체(e)에서 어떤 키가 눌렸는지 확인할 때 쓰는거! 1. 기본 사용법키보드 이벤트 처리할 때 이렇게 씀:$(document).on('keydown', function(e) { switch (e.which) { // e.keyCode도 됐었는데 이제 deprecated 됐다고 함 case 13: // Enter key submitForm(); break; case 27: // ESC key closeModal(); break; }});  2. 자주 쓰는 키 코드값들이거 자주 까먹어서 정리해둠:Enter: 13ESC: 27Space: 32Left Ar..