jQgrid의 지정한 칼럼, 지정한 열을 다른색으로 지정하기

사용자에게 해당칼럼이나 열의 정보를 강조하기 위해서 테이블의 배경색을 바꾸고 싶을 때는 다음처럼 처리한다. 

 

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

// 배경색상 css 선언 var cssGreen = {'background-color':'#6DFF6D'};      // 그리드 데이터의 ID 가져오기 var ids = $('#requestList').jqGrid('getDataIDs');      // 그리드 데이터 가져오기 var gridData = $("#requestList").jqGrid('getRowData');   // 데이터 확인후 색상 변경 for (var i = 0; i < gridData.length; i++) {          // 데이터의 is_test 확인     if (gridData[i].is_test == 'Y') {                  // 열의 색상을 변경하고 싶을 때(css는 미리 선언)         $('#requestList tr[id=' + ids[i] + ']').addClass('grid-test');                  // 칼럼의 색생을 변경하고 싶을 때         $('#requestList').jqGrid('setCell', ids[i], 'document_status_text', '', cssGreen);    } }

 

이상과 같이 처리하면 칼럼이나 열의 색상 변경이 가능하다. 

* loadComplete 시점에 처리하면 된다. 

다른 방법으로는 afterInsertRow 이벤트를 이용하는 방법도 있다. 

?

1 2 3 4 5 6 7 8 9 10 11 12

// grid setting         $('#statusList').jqGrid({                           afterInsertRow: function(rowid, rowdata , rowelem){                                   if (rowdata.job_type == "소계"){                                                       $("#"+rowid).css("background", "#e0ffff");                 }                               }                              });

 

출처 : jQgrid의 지정한 칼럼, 지정한 열을 다른색으로 지정하기 

[출처] jQgrid의 지정한 칼럼, 지정한 열을 다른색으로 지정하기|작성자 듀스포에