외부 데이터를 사용자 정의 jqGrid 포맷터 함수로 가져 오기

Question

jqGrid에서 사용자 정의 포맷터 함수를 사용하여 링크 된 다운로드 아이콘이있는 "다운로드"셀을 채 웁니다. 모든 코드를 인라인으로 처리했지만 모든 JS 코드를 사용자 지정 개체로 이동하여 패키지로 만들고 네임 스페이스를 지정했습니다. 자, 사용자 정의 포매터 함수가 호출되면 "this"참조가 jqgrid 테이블로 변경되고 그리드 생성 이전에 생성 된 아이콘 객체를 찾을 수 없습니다.

이 모든 것이 의미가 있습니다. 래핑 사용자 지정 개체의 일부인 아이콘 개체를 어떻게 참조 할 수 있는지 궁금합니다. ,

이

//loop over the json and build the colmodel, call custom formatter 
jQuery.each(jsonObj, function() { 
      var sdFields = this.supplementalData.fields.field; 
      len = sdFields.length; 
      for(var i=0; i<len; i++) { 
       if(sdFields[i].display) { 
        var currOption = {}; 
        currOption.name = sdFields[i].id; 
        currOption.index = sdFields[i].id; 

        if(sdFields[i].displayType == 'icon') { 
        currOption.formatter = this.resultsGridFormatter; 
        } else if(sdFields[i].dataType == 'date') { 
        //currOption.datefmt = 'mm/dd/YYYY'; 
        currOption.formatter = 'date'; 
        currOption.formatoptions = { 
         srcformat: 'Y-m-d', 
         newformat: 'm/d/Y' 
        }; 
        } 
        currOption.jsonmap = sdFields[i].id; 
        currOption.width = sdFields[i].width; 
        currOption.align = sdFields[i].align; 
        currOption.sorttype = sdFields[i].dataType; 
        currOption.sortable = sdFields[i].sortable; 
        currOption.resizable = sdFields[i].resizeable; 
        colModel[i] = currOption; 
       } 
      } 
}); 

//loop over jsonObj and build the icons object (assoc. array) 
this.setIcons = function(jsonObj) { 
    var iconsObj = {}; 
    jQuery.each(jsonObj, function() { 
    var sdIcons = this.supplementalData.icons.icon; 
    var len = sdIcons.length; 
    for(var i=0; i<len; i++) { 
     iconsObj[sdIcons[i].id] = sdIcons[i].file; 
    } 
    }); 
    this.icons = iconsObj; 
}; 

//custom formatter that formats icon cells by referencing the icons created above 
this.resultsGridFormatter = function(cellvalue, options, rowObject) { 
    console.log(this); 
    var icons = this.getIcons(); 
    var cellVal = ""; 
    var cssclass = "icon_"+options.colModel.name; 
    if(cellvalue != null) { 
      if(cellvalue.indexOf("://") != -1) { 
        //it is a URL, so link create the icon and link it 
        cellVal += "<a href='"+cellvalue+"' target='_blank'><img src='"+icons[options.colModel.name]+"' class='"+cssclass+"' /></a>"; 
      }else{ 
        //it is an id, so link to the details modal 
        cellVal += "<img src='"+icons[options.colModel.name]+"' id='"+cellvalue+"' class='"+cssclass+"' />"; 
      } 
    } else { 
      cellVal += "&nbsp;"; 
    } 
    //console.log(cellvalue); 
    //console.log(options); 
    //console.log(rowObject); 
    return cellVal; 
}; 

사용자 정의 포맷터에서 내 CONSOLE.LOG 문이있는 jqGrid 테이블을 출력하는 그런 방법이 없기 때문에 따라서 "this.getIcons()"호출이 실패 다음은 관련 코드입니다.

어쨌든 사용자 정의 포매터 내의 아이콘을 참조 할 수 있습니까? 어떻게 든 함수를 포함 시키거나 다른 접근법을 취해야합니까? 첫번째 파라미터 (새 this 값) 그리드 (source code 참조)이다

Answer 1

The custom formatter 함수 call마다 호출된다. 당신은 당신의 질문에도 그 사실을 기술합니다.

this 값을 필요에 따라 캐시하고 사용자 정의 포맷터 resultsGridFormatter 내부에서 사용하면 쉽게 코드를 수정할 수 있습니다. 내 말은, 코드를 다음과 같이 바꿀 수 있다는 것입니다.

var ts = this; 
//custom formatter that formats icon cells by referencing the icons created above 
this.resultsGridFormatter = function(cellvalue, options, rowObject) { 
    console.log(this); 
    console.log(ts); 
    var icons = ts.getIcons(); 
    var cellVal = ""; 
    // all your other previous code 
    return cellVal; 
};