프런트엔드/jqgrid

[jqGrid] 테이블 첫번째 로우 선택하기

jqGrid document: http://www.trirand.com/jqgridwiki/doku.php?id=wiki:jqgriddocs 

jqGrid demo: http://trirand.com/blog/jqgrid/jqgrid.html


첫번째 로우 선택 소스

$('#gridOper').jqGrid({
	url: '/test/list',
	postData: {
		...
	},
	colModel: [
		{ label: 'test', name: 'test', key: true, hidden: true},
		...
	],
	onSelectRow: function(rowid, status){
		//로우 선택시 처리하는 부분
		console.log($('#gridOper').getRowData(rowid));
	},
	loadComplete: function(data) {
		//첫번째 로우 선택
		var rowIds = $('#gridOper').jqGrid('getDataIDs');
		if(rowIds && rowIds.length > 0){
			$('#gridOper').jqGrid("setSelection", rowIds[0]);
		}
	}
});

첫번째 로우 선택할때 주의할 사항

    1.  onSelectRow를 선언한 경우
      위에 소스처럼 onSelectRow에 로직이 존재하면 loadComplete에 로우 선택이 있는경우 바로 실행
      로드하자마자 onSelectRow를 실행하는 경우면 문제가 없다.
      그러나 반대의 상황이라면 의도하지 않은 이벤트가 발생하여, 문제가 발생한다.

    2. 해결방안
      jqGrid에 onCellSelect 이벤트가 존재한다. 이건 로우가 아닌 cell에 이벤트가 걸린다.
      즉, 줄이 아닌 칸에 이벤트가 생긴다는 의미 그래서 setSelection에 이벤트가 걸리지 않는다.

    3. 주의할점
      onSelectRow와 onCellSelect는 줄과 칸에 이벤트가 걸리는 이벤트!
      두개의 이벤트가 존재한다면, 줄이나 칸을 선택하는 순간 두가지 이벤트가 모두 발생한다.