jqGrid를 사용하는데


특정 컬럼의 스타일을 


변경하고 싶은 경우 어떻게 해야할까?






loadComplete 메소드(데이터 로딩 후 호출되는 메소드) 내에서 처리!


// 배경색상 css 선언

var cssGreen = {'background-color':'#6DFF6D'};

   

// 그리드 데이터의 ID 가져오기

var ids = $('#gridName').jqGrid('getDataIDs');

   

// 그리드 데이터 가져오기

var gridData = $("#gridName").jqGrid('getRowData');


// 데이터 확인후 색상 변경

for (var i = 0; i < gridData.length; i++) {

var idx = ids[i];


// 열의 색상을 변경하고 싶을 때(css는 미리 선언)

$('#gridNametr[id=' + idx + ']').addClass('grid-test');

   

// 칼럼의 색생을 변경하고 싶을 때

$('#gridName').jqGrid('setCell', idx, 'document_status_text', '', cssGreen);


}




이렇게 처리하면 컬럼이나 열의 style을 변경할 수 있다.








jqGrid를 사용하는데


page, total, records 등을 제외한


추가로 사용할 데이터를 서버에서 전달받아야 할 경우,


클라이언트단에서는 어떻게 받아야 할까?




이 때 사용하는 것이 바로 jsonReader + userdata 이다.






1. 우선 서버에서 리턴하는 json 형태는 대략 다음과 같다고 가정하면,


{

"userdata"    :    { "title" : "어서오세요" , "subtitle" : "개발자 여러분..." }

, "rows"        :    { ... }

}







2. jqGrid의 속성 jsonReader는 다음과 같이 설정한다.


jsonReader : {

userdata    :    "userdata"

}







3. loadComplete에서 json형태로 출력하여 데이터 확인하기.


loadComplete : function(){

alert(JSON.stringify($("#gridName").getGridParam('userData')));

}


//getGridParam 으로 가져올 땐 userdata 가 아니라 userData 라는 것.




색깔 칠해뒀으니, 대소문자 주의해서 사용하길 바랍니다~!!





알기 전엔 어려움. ㅠㅠ


해보고 나니 되는 것을 확인  !_!


쉽다고 느낌. ^_^


사실 어려운 것이 아님 & 쉬운 거임. ㅇ_ㅇ



ㅂㅂㅇ




+ Recent posts