2010-04-19 4 views
0

jqgrid를 사용하고 있습니다. jquery로 대시 보드 기능을 구축하고 있습니다. 다른 응용 프로그램은 각각의 응용 프로그램 페이지를 등록해야하고 대시 보드는 해당 페이지를 렌더링합니다.이 작업을 수행하려면 jquery 플러그인 중 하나로 jqgrid를 사용하고 있습니다. 다음은 Evrything 작업 벌금 당신이 내가 응답 나에게 JSON을 줄 것이다 호출하고 그 안에 COLNAMES 수집을해야합니다 내가 동적으로 열 컬렉션을 얻고 코드 (Appication 페이지에서 볼 수 있듯이. 내 코드jqgrid 사용자 정의 포매터를 동적 열 집합으로 설정

var ph = '#' + placeHolder; 
    var _prevSort; 
    $.ajax({ 
     url: dataUrl, 
     dataType: "json", 
     async: true, 
     success: function(json) { 
      pager = $('#' + pager); 
      if (json.showPager === "false") { 
       pager = eval(json.showPager); 
      } 
      dataUrl += "&jqSession=true"; 
      $(ph).jqGrid({ 
       url: dataUrl, 
       datatype: "json", 
       sortclass: "grid_sort", 
       colNames: JSON.parse(json.colNames), 
       colModel: JSON.parse(json.colModel),     
       forceFit: true, 
       rowNum: json.rowNum, 
       rowList: JSON.parse(json.rowList), 
       pager: pager, 
       sortname: json.sortName, 
       caption: json.caption, 
       viewrecords: true, 
       viewsortcols: true, 
       sortorder: json.sortOrder, 
       footerrow: summaryFooter, 
       userDataOnFooter: summaryFooter, 
       jsonReader: { 
        root: "rows", 
        row: "row", 
        repeatitems: false, 
        id: json.sortName 
       }, 
       gridComplete: function() { 
        if (showFooter) { 
         $(ph).append("<tr class=\"ui-widget-content jqgrow\"><td style=\"overflow:visible; text-align:left;width:100%;font-weight:bold;\" class=\"ui-jqgrid- title\" colspan=\"" + json.colNum + "\">" + json.footerRow + "</td></tr>"); 
        } 
        if (json.additionalContent != null) { 
         $("#" + xContID).html(json.additionalContent); 
        } 
        $("ui-icon-asc").append("IMG"); 
        var _rows = $(".jqgrow"); 
        if (json.rows.length > 0) { 
         for (var i = 1; i < _rows.length; i += 1) { 
          _rows[i].attributes["class"].value = _rows[i].attributes["class"].value.replace(" ui-jqgrid-altrow", ""); 
          if (i % 2 == 1) { 
           _rows[i].attributes["class"].value += " ui-jqgrid-altrow"; 
          } 
         } 
         var gMaxHeight = getGridMaxHeight(); 
         var gHeight = ($(ph + " tr").length + 1) * ($($(".jqgrow") [0]).height()); 
         if (gHeight <= gMaxHeight) { 
          $(ph).parent().height(gHeight); 
         } 
         else { 
          $(ph).parent().height(gMaxHeight); 
         } 
        } 
        else { 
         $(ph).prepend("<tr class=\"ui-widget-content jqgrow\"><td style=\"overflow:visible; text-align:center;width:100%;font-weight:bold;\" class=\"ui- jqgrid-title\" colspan=\"" + json.colNum + "\">" + gridNoDataMsg + "</td></tr>"); 
         $(ph).parent().height(60); 
        } 
       }, 
       onSortCol: function(index, iCol, sortorder) {      
        dataUrl = dataUrl.replace("&jqSession=true", ""); 
        $(ph).jqGrid().setGridParam({ url: dataUrl }).trigger("reloadGrid"); 
        var _colName = "#jqgh_" + index; 
//     $(_prevSort).parent().removeClass("ui-jqgrid-sorted"); 
//     $(_prevSort).parent().addClass("ui-state-default"); 
//     $(_colName).parent().addClass("ui-jqgrid-sorted"); 
//     $(_colName).parent().removeClass("ui-state-default"); 
        _prevSort = _colName; 
        var _rows = $(".jqgrow"); 
        for (var i = 1; i < _rows.length; i += 1) { 
         _rows[i].attributes["class"].value = _rows[i].attributes["class"].value.replace(" ui-jqgrid-altrow", ""); 
         if (i % 2 == 1) { 
          _rows[i].attributes["class"].value += " ui-jqgrid-altrow"; 
         } 
        } 
       } 
      }).navGrid('#' + pager, { search: false, sort: false, edit: false, add: false, del: false, refresh: false }); // end of grid 
      $("#" + loadid).empty(); 
      gGridIds[gGridIds.length] = placeHolder; 
      SetGridSizes(); 
     }, 
     error: function() { 
      $("#" + loadid).html(loadingErr); 
     } 
    }); 

입니다 하지만, 유일한 문제는 우리가 열을 사용자 정의 포맷을 적용하려고 할 때오고있다.이 문제는 우리가있는 jqGrid에 "colModel"를 동적으로 할당하는 경우에만 제공됩니다.

사전에

감사합니다 도움 감사합니다

답변

0

나는 당신의 접근법이 매우 흥미 롭다고 생각한다. 주로 용도는 jqGrid.jqGridExporthttp://www.trirand.com/jqgridwiki/doku.php?id=wiki:import_methods을 참조하십시오. 조금 이상한 점은 contentType: 'application/json'$.ajax 옵션으로 사용하지 않는다는 것입니다. 이 경우 수신 된 데이터는 $.ajax에 의해 객체로 변환됩니다. 다음으로 의심되는 것은 여러분이 하나의 JSON.parse 호출과 관련하여 JSON 응답을 디코딩하지 않는다는 것입니다.

이 조언이 도움이되지 않으면 테스트 게시 게시 제안 JSON 응답에 문제가있는 사용자 정의 포매터가 포함되어 있습니다. 그러면 서버에 연결하지 않고도 문제를 재현 할 수 있습니다.