실습 jqGrid 버전: CDN 제공하는 v4.6 버전으로 테스트
Importing and Exporting
- 모듈을 사용하려면 src 디렉토리 JsonXml.js, grid.import.js 가 로드 되어야 한다.
- 전체 그리드의 구성을 다른 파일형식으로 import 또는 export 하는것이 유용한 경우가 있다.
1) 서버에 구축된 그리드는 정렬 또는 페이징 후에 재구성 될 수 있으므로 필요에 따라 다른 구성을 신속하게 사용할 수 있다.
2) 그리드는 서버에서 시각적으로 구성한다음 XML 문자열로 로드할 수 있다.
3) 그리드 구성은 XML로 DB에 저장한 다음에 필요에 따라 로드할수도 있다.
* jqGrid는 구성과 데이터를 한번에 로드할 수 있다.
메소드
1004lucifer
내보내기 (Exporting)
- 현재 그리드 구성을 내보내려면 다음과 같이 jqGridExport 를 사용한다.
jQuery("#grid_id").jqGrid('jqGridExport', options);grid_id - 생성된 그리드의 id
options - name:value 쌍의 배열이다. (아래 참고)
* jqGridImport 메소드를 사용하기전에 이 메소드를 사용하는게 좋다.
| Option | Type | Description | Default |
|---|---|---|---|
| exptype | string | 내보낼 유형을 결정한다. (두가지 값 허용) xmlstring - 그리드 구성이 xml 문자열로 내보내진다. jsonstring - 그리드 구성이 json 문자열로 내보내진다. |
xmlstring |
| root | string | 이 요소는 데이터를 내보낼 때 root 요소의 이름을 설정한다. 즉, 그리드 구성이 요소에 포함되어 있다. 내보낸 데이터는 다음과 같다. xmlstring - <rootelement>jqgrid_configuration </rootelement> jsonstring - {rootelement:{grid_configuration}} |
grid |
| ident | string | 보기 좋게 하기 위한 탭 또는 들여쓰기 문자열 | \t |
그리드의 일부 컬럼이 동적으로 만들어지기 때문에(row번호, 서브그리드 등) export 메소드는 필요없는 모든 데이터를 똑똑하게 제거하고 jqGridImport 에서 사용할 수 있도록 문자열 구성을 준비한다.
1004lucifer
이러한 방법을 사용할 때 그리드 옵션의 page 파라메터는 다음과 같이 설정되면 안된다.
pager: jQuery('#mypager')
다음과 같이 설정을 해야 한다.
pager: '#mypager'
또는
pager: 'mypager'
그렇지 않으면 import / export 가 정상적으로 작동하지 않는다.
export를 수행할 때 그리드 구성 및 관련된 이벤트만 내보낸다.
navigator는 내보내지 않으며, importComplete 이벤트를 사용하여 jqGridImport에서 navigator를 수동으로 구성이 가능하다.
가져오기 (Importing)
- 이 메소드는 그리드 구성에 따라 옵션규칙(rules)과 그리드의구성을 읽어들이며, 그리드를 처음 구성할 때 그 구성으로 다시 그리드에 데이터를 전달하는 것이 가능하다.
1004lucifer
이 작업은 jqGridImport를 사용하여 수행된다.
jQuery("#grid_id").jqGrid('jqGridImport', options);grid_id - 생성된 그리드의 id
options - name:value 쌍의 배열이다. (아래 참고)
| Option | Type | Description | Default |
|---|---|---|---|
| imptype | string | import 유형은 xml, json, xmlstring, jsonstring 중에 하나이다. | xml |
| impstring | string | xmlstring 또는 jsonstring 의 경우 설정해 줘야 한다. | |
| impurl | string | xml 또는 json 인 경우 유효한 url을 구성한다. ajax 요청을 통해 데이터를 받는다. |
|
| mtype | string | request 타입을 설정한다. ex) GET | POST |
GET |
| impData | object | name:value 쌍으로 되어있는 url에 전달할수 있는 데이터 | empty object {} |
| xmlGrid | object | xml 구성과 데이터의 위치를 기술한다. config - 구성 태그 data - 데이터 태그 |
config : “roots>grid”, data: “roots>rows” |
| jsonGrid | object | json 구성과 데이터의 위치를 기술한다. config - 구성 태그 data - 데이터 태그 |
config : “grid”, data: “data” |
| ajaxOptions | object | ajax 요청에 전달할 추가 옵션 | empty object {} |
PS.
xmlstring 형식으로 import 할 때 다음과 같은 이슈가 있었다.
- 오류사항 (Syntax error, unrecognized expression: rows>page)
이벤트
- jqGridImport 에서 호출할 수 있는 이벤트는 하나뿐이다.
1004lucifer
| Event | Description |
|---|---|
| importComplete | 이 이벤트는 import 가 성공적으로 수행되고 그리드가 구성된 후 호출된다. 이 이벤트로 서버에 데이터를 호출한다. 이 이벤트를 사용하여 그리드에 추가 매개변수를 설정하거나 navigator를 구성한다. |
Export
Import
참고
- http://www.trirand.com/jqgridwiki/doku.php?id=wiki:import_methods
댓글
댓글 쓰기