JS/jqGrid

[jqGrid] 10. 자주쓰는 함수

인생아 2024. 9. 11. 16:55
반응형

jqGrid는 웹 애플리케이션에서 그리드 데이터를 쉽게 관리할 수 있는 강력한 도구입니다. 이를 통해 데이터를 표시하고 수정하는 등 다양한 작업을 할 수 있습니다. 이번 글에서는 jqGrid에서 자주 사용되는 여러 함수에 대해 간단히 설명하고, 각 함수의 사용 예제를 제공합니다.

getDataIDs

getDataIDs 함수는 그리드에 있는 모든 행의 ID 목록을 배열로 반환합니다. 데이터를 처리할 때 특정 행을 선택하거나 수정할 때 유용하게 사용할 수 있습니다.

var ids = $("#grid").jqGrid('getDataIDs');
console.log(ids); // 모든 행의 ID 출력

 

 

getRowData

getRowData 함수는 특정 행의 데이터를 객체 형식으로 반환합니다. 매개변수로 행 ID를 전달하면 해당 행의 데이터를 가져올 수 있습니다.

var rowData = $("#grid").jqGrid('getRowData', rowId);
console.log(rowData); // 특정 행의 데이터 출력

 

 

getCol

getCol 함수는 특정 컬럼의 모든 데이터를 배열로 반환합니다. 매개변수로 컬럼명을 전달하면 그 컬럼의 데이터를 가져올 수 있습니다.

 
var colData = $("#grid").jqGrid('getCol', 'name');
console.log(colData); // 'name' 컬럼의 모든 데이터 출력

 

setCell

setCell 함수는 특정 셀의 값을 설정하거나 스타일을 변경하는 데 사용됩니다.

$("#grid").jqGrid('setCell', rowId, 'name', '새로운 값', 'ui-state-highlight');

 

 

setSelection

setSelection 함수는 특정 행을 선택하는 데 사용됩니다. 이 함수는 행을 강조하거나 선택할 때 유용합니다.

$("#grid").jqGrid('setSelection', rowId);

 

 

getGridParam

getGridParam 함수는 그리드의 특정 파라미터 값을 가져옵니다. 그리드의 설정 정보를 확인할 때 유용합니다.

var gridWidth = $("#grid").jqGrid('getGridParam', 'width');
console.log(gridWidth); // 그리드 너비 출력

 

 

editCell

editCell 함수는 특정 셀을 편집 상태로 전환합니다.

$("#grid").jqGrid('editCell', rowId, colIndex, true);

 

saveCell

saveCell 함수는 특정 셀의 편집을 종료하고 저장합니다.

$("#grid").jqGrid('saveCell', rowId, colIndex);

 

 

restoreCell

restoreCell 함수는 특정 셀의 편집을 취소하고 원래 상태로 되돌립니다.

$("#grid").jqGrid('restoreCell', rowId, colIndex);

 

 

bindKeys

bindKeys 함수는 키보드 단축키를 설정하여 행을 선택하거나 편집할 수 있도록 합니다.

$("#grid").jqGrid('bindKeys');

 

 

triggerToolbar

triggerToolbar 함수는 툴바 필터링을 트리거하여 그리드 데이터를 필터링합니다.

$("#grid").jqGrid('triggerToolbar');

 

 

setGridState

setGridState 함수는 그리드의 상태를 변경하는 데 사용됩니다. 그리드를 최소화하거나 복원할 수 있습니다.

$("#grid").jqGrid('setGridState', 'hidden'); // 그리드 숨기기
$("#grid").jqGrid('setGridState', 'visible'); // 그리드 보이기

 

 

sortGrid

sortGrid 함수는 특정 컬럼을 기준으로 그리드를 정렬합니다.

$("#grid").jqGrid('sortGrid', 'name', true);

 

 

hideCol

hideCol 함수는 특정 컬럼을 숨기는 데 사용됩니다.

$("#grid").jqGrid('hideCol', 'name'); // 'name' 컬럼 숨기기

 

 

showCol

showCol 함수는 숨겨진 특정 컬럼을 다시 표시합니다.

$("#grid").jqGrid('showCol', 'name'); // 'name' 컬럼 표시

 

 

addRow

addRow 함수는 그리드에 새로운 행을 추가합니다.

$("#grid").jqGrid('addRow', {
    rowID: 'newRow',
    initdata: { name: '새로운 행', age: 25 },
    position: "last"
});

 

 

delRow

delRow 함수는 특정 행을 삭제합니다.

$("#grid").jqGrid('delRowData', rowId);

 

 

editRow

editRow 함수는 특정 행을 편집 모드로 전환합니다.

$("#grid").jqGrid('editRow', rowId, true);

 

 

saveRow

saveRow 함수는 특정 행의 편집을 저장합니다.

$("#grid").jqGrid('saveRow', rowId);

 

 

cancelRow

cancelRow 함수는 특정 행의 편집을 취소합니다.

 
$("#grid").jqGrid('restoreRow', rowId);

 

 

참고 사이트: http://www.trirand.com/jqgridwiki/doku.php?id=wiki:methods

반응형