분류 전체보기 35

[jqGrid] 이벤트 핸들링 - ready, loadComplete, onSelectRow, change

1. 페이지 로드 시 초기 이벤트 설정$(document).ready(function ($) { // 날짜 선택기 초기화 $("#startDate").datepicker(); $("#endDate").datepicker(); // 버튼 초기 상태 설정 $('#editBtn').prop("disabled", true); $('#printBtn').prop("disabled", true); // 검색 버튼 클릭 이벤트 $('#searchBtn').click(function (e) { $("#currentPage").val(1); searchData(); e.preventDefault(); }); // 그리드 반..

개발노트/jqGrid 2025.01.02

[jqGrid] 그리드 데이터 다루기 - 값 가져오기/수정하기

행 데이터 가져오기// 선택된 행의 데이터 가져오기const rowId = $("#grid").jqGrid('getGridParam', 'selrow');const rowData = $("#grid").jqGrid('getRowData', rowId);// 특정 행의 모든 데이터const specificRowData = $("#grid").jqGrid('getRowData', '행_ID');  셀 값 가져오기// 특정 셀의 값 가져오기const cellValue = $("#grid").jqGrid('getCell', rowId, 'columnName');// getCellValue 사용const value = $("#grid").jqGrid('getCellValue', rowId, 'columnName'..

개발노트/jqGrid 2025.01.01

[JavaScript] 값 제어하기 - set/get 사용법 복습

HTML 요소에서 값 가져오기// id로 접근해서 값 가져오기 const value1 = document.getElementById('elementId').value;// jQuery로 값 가져오기 const value2 = $('#elementId').val();// name으로 접근해서 값 가져오기const value3 = document.getElementsByName('elementName')[0].value;  HTML 요소에 값 설정하기// id로 접근해서 값 설정document.getElementById('elementId').value = '새로운 값';// jQuery로 값 설정$('#elementId').val('새로운 값');// name으로 접근해서 값 설정 document.getE..

[jqGrid] SubGrid로 상세 데이터 표시하기

오늘은 jqGrid에서 SubGrid 설정하면서 배웠던 내용들을 정리해본다.처음에는 단순히 옵션만 설정하면 되는 줄 알았는데, 실제로 해보니 신경 쓸 게 은근 많았다.  1. 기본 설정 먼저 SubGrid를 활성화하고 기본적인 모양을 잡아주는 설정:$("#mainGrid").jqGrid({ // ... 다른 설정들 ... subGrid: true, // SubGrid 사용 subGridOptions: { plusicon: "ui-icon-triangle-1-e", // 접힌 상태 minusicon: "ui-icon-triangle-1-s", // 펼쳐진 상태 openicon: "ui-icon-arrowreturn-1-e", // 화살표 ..

개발노트/jqGrid 2024.12.31

[jqGrid] 기본 그리드 만들기

0. 태그와 jqGrid의 주요 차이점 이름 나이 태그로만 테이블 만들었던 사람 나야 나--> $("#grid").jqGrid({ sortable: true, // 정렬 기능 바로 사용 가능 pager: '#pager', // 페이징 기능 바로 사용 가능 // ... 다른 설정들}); jqGrid를 사용하면 좋은 경우:대규모 데이터를 다루는 관리자 페이지복잡한 데이터 조작이 필요한 경우Excel과 유사한 기능이 필요한 경우일반 테이블을 사용하면 좋은 경우:간단한 데이터 표시만 필요한 경우사용자 정의 UI가 많이 필요한 경우가벼운 웹페이지를 만들 때 1. 필요한 라이브러리 추가하기먼저 HTML 파일에 필요한 라이브러리들을 추가해야 한다.△ 위의 예시는 ..

개발노트/jqGrid 2024.12.30