Question

我正在使用jqgrid。我们正在使用jquery构建仪表板功能。不同的应用程序只需要注册相应的应用程序页面，仪表板将呈现该页面。为此，我们使用jqgrid作为jquery插件之一。以下是我的代码

 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);  
        }  
    });

从代码中可以看到我动态获取列集合（我正在调用的应用程序页面会在响应中给我JSON并且会在其中包含colNames集合.Evrything工作正常但是，只有问题才会出现正在尝试将自定义格式化程序应用于列。只有当我们动态地将“colModel”分配给jqgrid时才会出现此问题。

感谢帮助

提前致谢

Answer 1

我发现你的方法非常有趣。主要用于此目的jqGrid.jqGridExport请参阅http://www.trirand.com/jqgridwiki/doku.php?id=wiki:import_methods。唯一让我觉得有点奇怪的是，你没有使用contentType: 'application/json'作为$.ajax选项。在这种情况下，接收的数据将由$.ajax转换为对象。下一个可疑的事情是你没有解码JSON响应一个JSON.parse电话。

如果此建议对您没有帮助，我建议您发布测试JSON响应，其中包含您遇到问题的自定义格式化程序。然后，我将无需连接到您的服务器即可重现您的问题。

jqgrid将自定义格式化程序设置为动态列集合

1 个答案: