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

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

// 배경색상 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 이벤트를 이용하는 방법도 있다. 

// grid setting

        $('#statusList').jqGrid({

             

            afterInsertRow: function(rowid, rowdata , rowelem){

                 

                if (rowdata.job_type == "소계"){                                 

                     $("#"+rowid).css("background", "#e0ffff");

                }

                 

            }       

             

        });