초급 개발자 mylee 개발 노트

jqGrid를 쓰면서 자주 사용했던 메서드들 총정리나중에 또 까먹을까봐 기록해두는 중... 🤔 1. setRowData그리드의 특정 행 데이터를 업데이트할 때 사용한다.문법$("#grid").jqGrid('setRowData', rowid, data, cssp)매개변수rowid: 업데이트할 행의 ID (필수)data: 업데이트할 데이터 객체 (필수)cssp: CSS 속성 (선택)사용 예시// 단일 컬럼 업데이트$("#myGrid").jqGrid('setRowData', rowId, {'name': 'John'});// 여러 컬럼 동시에 업데이트$("#myGrid").jqGrid('setRowData', rowId, { 'name': 'John', 'age': 25, 'city': 'Se..

오늘 코드 리뷰하다가 이벤트 중복 바인딩 이슈가 있어서 해보는 정리🤔 이벤트 중복 바인딩이 발생하는 경우실제로 발견한 중복 코드:// 상단에 있던 코드$('#btnSearch').unbind().click(_eventSearch); //검색 버튼 클릭// 하단에 있던 코드$('#btnSearch').click(function(e){ $("#page").val(1); _eventSearch(); e.preventDefault();}); 이러면 검색 버튼 누를 때 _eventSearch 함수가 두 번 실행될 수 있음.근데 다행히 unbind()가 있어서 이전 이벤트는 제거됐었다.  비슷한 중복 패턴들:// 패턴 1: document.ready 안에서 중복$(document).ready(fu..

프로젝트하면서 제일 많이 만드는 게시판 예제로 정리해봄.기본적인 CRUD랑 검색, 정렬 다 들어있음.   1. HTML 구조 검색 글쓰기     2. jqGrid 초기화 및 설정 $(document).ready(function() { initGrid(); initEvents();});function initGrid() { $("#boardGrid").jqGrid({ url: '/api/board/list', datatype: 'json', mtype: 'POST', colNames: ['번호', '제목', '작성자', '작성일', '조회수', 'boardId'], ..

내가 보려고 카테고리별로 나눈 jqGrid의 주요 메서드와 이벤트 1. 데이터 관련 메서드일단 제일 많이 쓰는 데이터 가져오기/설정하기 메서드들// 데이터 가져오기$grid.getRowData(rowId) // 특정 행 데이터. 제일 자주 씀$grid.getDataIDs() // 모든 행 ID 배열. forEach 돌릴 때 씀$grid.getLocalRow(rowId) // 로컬 데이터에서 가져올 때$grid.getCell(rowId, colName) // 특정 셀만 필요할 때$grid.getCol(colName) // 컬럼 전체 값이 필요할 때$grid.getGridParam('data') // 그리드 전체 데이..

## 문제 상황게시글 수정 시 기존 첨부파일을 삭제해도 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(""); // 파일 정보는 ..

오늘 댓글 삭제 기능 구현하다가 생긴 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..