선택 편집 유형 및 사용자 정의 포맷터없이 조건부로 열을 색상 표시하는 방법

Question

선택 편집 유형으로 조건부로 열 텍스트의 색상을 지정하고 싶습니다. 사용자 정의 포맷터를 사용하면 값이 변경됩니다. 아래 코드는 작동하지 않습니다.

function generateEventHandlerGrid(eventsJson){ 
     var eventGrid = $("#eventGrid"); 
      eventGrid.jqGrid({ 
       datatype: 'local', 
       data: eventsJson.eventInfo, 
      jsonReader: {repeatitems: false}, 
    colNames: ['Event Category', 'Event Creation'], 
{name: 'eventCategory', index: 'eventCategory',align:"center"}, 
{name: 'enabled', index: 'enabled', width:"100px",align:"center",editable:true,edittype: 'select', 
       editoptions: {value: "1:Enable;0:Disable"}, formatter: function (cellvalue, options, rowObject){ 
        if (rowObject.enabled == 1){ 
         var cellHtml = "<span style='color:" + "red" + "' originalValue='" + rowObject.enabled + "'>" + "Enable" + "</span>"; 
         return cellHtml; 
        }else{ 
         var cellHtml = "<span style='color:" + "green" + "' originalValue='" + rowObject.enabled + "'>" + "Disable" + "</span>"; 
         return cellHtml; 
        } 
       }}], 
    viewrecords: true, 
    gridview: true, 
    rownumbers: true, 
    shrinkToFit: false, 
       height: strMinimumHeight, 
       editurl: "clientArray", 
       restoreAfterSelect: false, 
       loadonce: true, 
    } 

사용자 정의 포맷터없이 값을 기준으로 텍스트 색상을 설정하는 방법은 무엇입니까?

Answer 1

맞춤형 포맷터의 목표는 의 내용물입니다. 현재 코드에서 수행하려는 작업은 셀의 외부 DOM 요소에 속성으로 설정되어 있습니다. 가장 좋은 점은 cellattr 콜백입니다. 따라서 예를 들어, 내용을으로 포맷하고 일부 스타일이나 클래스를 설정하여 셀의 속성을 변경하는 등의 포맷터를 사용할 수도 있습니다.

cellattr 콜백 매개 변수의 정확한 목록은 사용하는 jqGrid의 버전과 포크에 따라 다릅니다. 당신은 당신이 게시 된 다음 코드

cellattr: function (rowid, cellValue, rowData, cm, item) { 
    return " style='color:" + (rowData.enabled == 1 ? "red" : "green") + "'"; 
}