Transcript jqGrid - 멋진인생

jqGrid
작성자 : 멋진인생
이메일 : [email protected]
홈페이지 : http://run2you.tistory.com
Basic Grid options(1)
Property
Type
Description
default
url
string
호출할 url
null
datatype
string
Grid 를 처리할 응답, xml, json 등
xml
colNames
array[]
Header layer 에 들어갈 컬럼 이름
empty array[]
colModel
array
컬럼의 파라미터를 서술한 배열
empty array
rowNum
integer
Grid 에 표시될 rows 수, 서버에서 n개를 리턴하더라도 표기된 수 만큼만
표시 해 줌. -1 값일경우는 무제한으로 표시함
20
caption
string
Header layer 에 표시될 제목
empty string
autowidth
boolean
True 시 부모 요소의 길이로 grid 길이를 재 계산 하여 설정
false
width
number
해당 필드가 세팅되어 있지 않다면 colModel (in pixels) 의 값을
계산 하여 width 산정, 세팅 되어 있다면 각 컬럼의 길이를 shrinkToFit(＊)
옵션 의 값에 의해 산정
none
rownumbers
boolean
True 일시 좌측에 1부터 시작하는 컬럼을 추가
false
toolbar
array
첫번째 boolean 은 툴바의 노출 여부 , 두번째 값은 툴바의 위치
“top”,”bottom”, “both” 중 하나 선택.
[false,'']
＊shrinkToFit : 각 컬럼 의 길이를 width 값을 기준 하여 계산하게 만드는 옵션. 기본값 true
Basic Grid options(2)
Property
Type
Description
default
height
mixed
Grid 의 높이. 숫자입력(픽셀), 퍼센티지(100%로만 가능), ‘auto’
상기 세가지 경우만 가능
150
multiselect
boolean
True 일시 다중 선택 가능. 왼쪽에 새로운 컬럼(checked) 생성됨
true 일시 colModel 의 name 에 rn 을 설정 하지 말것. 새로운 컬럼 이름이
자동으로 rn 으로 생성되기에 중복이 발생됨
false
footerrow
boolean
True 일시 grid 와 pager 사이에 footer 테이블이 하나 생성됨
false
userDataOnFooter
boolean
Ajax 응답 결과 userData 의 값이 있고 colModel 의 name 과
동일 할시 footerrow 에 userData 의 값을 뿌려줌
false
gridview
boolean
3.4 버전의 jQgrid 는 속도가 늦었지만 3.5 이후는 빨라졌다고함. 하지만
treeGrid, subGrid 와 afterInsertRow event 를 사용하지 않을 시 이 필드를
true 시킨 것만으로 속도를 더욱 향상 시킨다고 함
false
selrow
string
읽기 전용. 마지막 선택한 row 의 id 를 반환
null
selarrrow
array-[]
multiselect 가 true 일시 선택된 row 의 id 들을 반환
empty array []
hiddengrid
boolean
True 일시 grid 가 숨김 상태이다. (서버에 요청조차 하지 않음)
Caption 레이어에 있는 show/hide 버튼클릭시 서버에 요청 and grid 노출
false
colModel Options
Property
Type
Description
default
align
string
Cell 에서의 위치 left, center, right 사용가능
left
editable
boolean
수정 가능 여부
false
name
string
컬럼 에서의 유일한 이름을 설정하여야 함. 이 값은 필수값
Required
resizable
boolean
해당 셀의 Resize 여부
true
width
number
해당 셀의 초기화 width , 현재 percentage 는 지원 않함
150
event
Event
Parameters
Description
loadComplete
xhr
모든 서버 요청 이후 바로 실행됨
loadError
xhr,
status,
error
요청이 실패 했을 시 호출
onSelectRow
rowid,
status
Row 를 클릭 했을 시 발생
onCellSelect
rowid,
iCol,
cellcontent,
target
Row의 cell 을 클릭시 발생
rowid : 선택된 row의 id
iCol : cell 의 index
Cellcontent : cell 의 content
target : 클릭한 target 요소
onSelectAll
aRowids,
status
multiselect 옵션이 true 이면서 header 체크박스를 클릭시
aRowids : 선택된 row의 id 배열
status : 선택되면 true, 선택해제되면 false
gridComplete
none
그리드에 모든 데이터들이 로드 되고 다른 프로세스 들이 끝난후에 발생함
rowid: 클릭된 row의 id
Status: 선택된 상태. multiselect가 true 일시 선택되면 true, 선택 해제 시 false. multiselect 가
false 이면 무조건 true
xhr : XMLHttpRequest object
method
Method
Parameters
returns
Description
setSelection
rowid,
onselectrow
true on success,
false otherwise
row 의 id 가 rowid 와 같으면 선택
onselectrow 가 true 이면(defaullt) onSelectRow 이벤트 발생
trigger(“reloadGri
d”)
none
jqGrid object
현재 설정된 세팅 으로 리로드함. 서버에 재 요청을 보냄
getRowData
rowid
array{}
id = rowid 인 row 의 값을 요청 name:value 형식이며
name 은 colModel 의 name 과 매칭함
getGridParam
name
mixed value
Basic Grid options의 property = name 인 값을 반환
Name 생략시 Basic Grid options 의 모든 값을 object 배열로 return
getCell
rowid,
iCol
cell content
id = rowid 이며 column = iCol 인 컬럼의 content 를 반환
iCol 은 column 의 index 혹은 colModel의 name
• 참조 사이트
–
–
–
http://www.trirand.com/blog/ jQgrid 사이트
http://www.trirand.com/jqgrid/jqgrid.html jQgrid 데모
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:jqgriddocs jQgrid document