jqGrid() 메소드
- jQuery의 jqGrid 플러그인에서 사용되는 메소드
1. grid.jqGrid('getDataIDs')
: 현재 그리드에 있는 모든 데이터 행의 id를 배열 형태로 반환함 이 메소드 호출할 때, 반환되는 id값은 그리드에 추가된 데이터 행의 고유 식별자
colModel: [
{ name: 'id', index: 'id', key: true },
{ name: 'name', index: 'name' },
{ name: 'age', index: 'age' }
]
여기서 key: true로 설정된 id 컬럼이 각 행의 고유 id로 사용됨
e.g. 데이터 추가할 때 id 지정
grid.jqGrid("addRowData", "1", { id: "1", name: "John", age: 30 });
첫번째 매개변수로 id를 명시적으로 지정해야 한다. 위의 예에서 "1"이 id로 사용된다.
2. grid.jqGrid('getGridParam', 'colModel')
: jqGrid에서 그리드의 설정 정보 중 colModel을 가져오는 메소드
- colModel 구성요소
- name: 컬럼의 이름 (데이터 속성과 매핑)
- index: 정렬 및 검색 시 사용할 데이터 속성의 이름
- width: 컬럼의 너비
- sortable: 정렬 가능 여부 (true/false)
- editable: 셀 편집 가능 여부 (true/false)
- key: 고유 식별자인지 여부 (true/false)
- formatter: 데이터 형식을 지정하는 함수
- 기타 다양한 속성
e.g. 각 객체는 그리드의 열을 구성하며, id열은 고유 식별자로 설정되어 있으며 name과 age열은 정렬 및 편집이 가능하다.
colModel: [
{ name: 'id', index: 'id', key: true, width: 75, sortable: true },
{ name: 'name', index: 'name', width: 150, sortable: true, editable: true },
{ name: 'age', index: 'age', width: 100, sortable: true, editable: true }
]
grid.jqGrid('getGridParam', parameterName);
여기서 parameterName은 가져오고자 하는 특정 설정의 이름 현재 그리드의 특정 설정이나 파라미터 값을 가져오는 데 사용된다.
3. grid.setCell(id, 'CHK_BOX', "Yes")
지정된 행의 특정 셀(CHK_BOX)값을 설정하는 메소드
- 매개변수
- id: 수정할 행의 ID
- 'CHK_BOX': 수정할 셀의 컬럼 이름, 이 예제에서는 체크박스에 해당하는 컬럼
- "Yes": 셀에 설정할 값, 여기서는 체크박스를 체크 상태로 나타내기 위해 "Yes"라는 값을 설정
4. grid.editRow(id)
지정된 행(idx)을 편집 모드로 전환하는 메소드
매개변수: 편집할 행의 id
5. grid.restoreRow(id)
특정 행을 편집모드에서 일반 모드로 되돌리는 기능
편집모드에서 변경된 내용을 취소하고, 해당 행을 이전 상태로 복원한다.
매개변수: 복원할 행의 id
6. grid.setSelection(id, true)
특정 행을 선택하는 기능
지정된 행을 선택하여 사용자에게 해당 행이 현재 선택되었음을 시각적으로 나타냄
- 매개변수
- id: 선택할 행의 id
- true: 선택 상태로 설정, false: 선택 해제 상태로 설정
7. grid.jqGrid('setGridParam', { ondblClickRow: this.dblClickRowEventCallback })
그리드 설정을 동적으로 업데이트하여, 특정 이벤트 (이 예제에서는 더블클릭)에 대한 사용자 정의 동작을 지정한다.
grid.jqGrid('setGridParam', {...}) : jqGrid의 설정을 변경하는 데 되며. 객체 형태로 여러 설정을 전달할 수 있다.
ondblClickRow 해당 속성은 사용자가 행을 더블 클릭했을 때 실행될 함수 지정 ()사용자 정의 콜백 함수)
- 매개변수로 사용될 수 있는 속성: ondblClickRow, beforeSelectRow, loadComplete, loadError, onSelectRow, onCellSelect, afterSaveCell, afterEditCell, onSelectAll
8. grid.jqGrid('setColProp', col, value)
특정 컬럼의 속성을 변경해 그리드의 동작이나 표시 방식을 수정함
- 매개변수
- col: 수정할 컬럼의 id
- value: 해당 컬럼에 설정할 새로운 속성 값, 객체 행태로 전달되어 여러 속성을 동시에 변경할 수 있음
e.g.
grid.jqGrid('setColProp', 'age', { editable: true, width: 100 });
9. grid.jqGrid().getGridParam("page")
현재 페이지 번호를 가져오는 메소드
두 방법의 차이는? 기능적 차이는 없다!
grid.jqGrid().getGridParam("page");
grid.jqGrid('getGridParam', 'page');
10. grid.clearGridData()
현재 그리드에 표시된 모든 데이터 제거하는 기능
11. grid.setGridParam(opts)
그리드의 설정을 동적으로 업데이트하는 기능
e.g.
grid.setGridParam({
url: 'newDataUrl', // 새로운 데이터 URL
datatype: 'json', // 데이터 형식 변경
page: 1 // 페이지를 첫 페이지로 설정
});
12. grid.getGridParam('selarrrow')
현재 선택된 행의 id 배열 반환
이 메소드의 반환값을 toString() 해주면 id 배열이 , 를 구분자로 하여 String 형태로 변한다.
e.g.
[1, 2, 3, 4] → “1, 2, 3, 4”
13. grid.delRowData(selectIds[i])
특정 행을 그리드에서 삭제하는 기능
댓글