0

在我的 jqGrid 中有以下内容：

colModel.push({ name: 'pcc2008-2007', index: 'pcc0807', width: 100, align: "Right",
    sorttype: "float", formatter: "number", resizable: false,
    formatter: function (cellvalue, options, rowObject) {
        return percentageChange(rowObject['vol08'], rowObject['vol07'], 4);
    }
});

格式化程序工作得很好，最后返回一个值（带有前缀 %），但是当我点击网格上的列标题时，结果并没有按以前的顺序排序。

我添加了一个“unformatter”函数，它只是简单地替换“%”，看是否产生了正确的排序，但同样排序根本没有正确实现。

谁能解释我做错了什么？

** 编辑 **

function percentageChange(endYear, startYear, duration) {
    var p1 = Math.abs((endYear - startYear) / Math.abs(startYear) * 100);
    if (p1 == Number.POSITIVE_INFINITY || p1 == Number.NEGATIVE_INFINITY) { return '0'; }
    if (isNaN(p1)) { return '0'; }
    else { return Math.round(p1 * 100) / 100; }
}

** EDI2 **

整个 jqGrid 在这里调用：

$("#list2").jqGrid({
    datastr: formattedBrandData,
    datatype: "jsonstring",
    colModel: colModel,
    height: 'auto',
    width: 1000,
    loadonce: true,
    sortable:  true,
    gridview: true,
    shrinkToFit: false,
    viewrecords: true,
    rowNum: 100,
    gridComplete: function (index, colindex, sortorder) {

        var aaa = $("#list2").jqGrid('getRowData');
        formattedBrandData = aaa;
        drawChart();


        var rowIDs = jQuery("#list2").getDataIDs();
        for (var i = 0; i < rowIDs.length; i = i + 1) {
            if (i == 0) { var trElement = jQuery("#" + rowIDs[i], $('#list2')); trElement.removeClass('ui-widget-content'); trElement.addClass('resultsColour1'); }
            if (i == 1) { var trElement = jQuery("#" + rowIDs[i], $('#list2')); trElement.removeClass('ui-widget-content'); trElement.addClass('resultsColour2'); }
            if (i == 2) { var trElement = jQuery("#" + rowIDs[i], $('#list2')); trElement.removeClass('ui-widget-content'); trElement.addClass('resultsColour3'); }
            if (i == 3) { var trElement = jQuery("#" + rowIDs[i], $('#list2')); trElement.removeClass('ui-widget-content'); trElement.addClass('resultsColour4'); }
            if (i == 4) { var trElement = jQuery("#" + rowIDs[i], $('#list2')); trElement.removeClass('ui-widget-content'); trElement.addClass('resultsColour5'); }
            if (i == 5) { var trElement = jQuery("#" + rowIDs[i], $('#list2')); trElement.removeClass('ui-widget-content'); trElement.addClass('resultsColour6'); }
            if (i == 6) { var trElement = jQuery("#" + rowIDs[i], $('#list2')); trElement.removeClass('ui-widget-content'); trElement.addClass('resultsColour7'); }
            if (i == 7) { var trElement = jQuery("#" + rowIDs[i], $('#list2')); trElement.removeClass('ui-widget-content'); trElement.addClass('resultsColour8'); }
        }
    },

    loadComplete: function () {

    },


    jsonReader: {
        repeatitems: false,
        root: function (obj) {
            return obj;
        },
        onComplete: function (data, response) {

        }
    }
});
4

1 回答 1

3

我认为你应该更好地使用

formatter: 'currency', formatoptions: {suffix: '%'}, sorttype: 'currency'

查看演示：

在此处输入图像描述

更新：您发布的代码中存在一些问题。

第一个是gridCompletejqGrid 将调用的回调。jqGrid 永远不会gridComplete使用附加参数调用，因此index，您的回调colindex的sortorder参数将始终为undefined. 您应该删除参数。

第二个问题是设计问题。您与提供数据的哪个datatype: "jsonstring"一起使用。datastr: formattedBrandData数据将被读取一次，数据将保存在内部data数组中，其name属性与colModel. 因此，在array内部填充'pcc2008-2007'属性formattedBrandData会更有效、更容易。您将计算一次该值，并将仅使用float计算的结果。稍后您可以直接使用预定义currency的格式化程序（参见我上面的答案），仅%在浮点值的末尾添加。

如果您使用某些本地数据类型（包括datatype: "jsonstring"），则永远不应使用indexother as name。最好index从 中删除任何定义，colModel以防将使用name属性中的值。name和的不同值是受支持的，只有在服务器代码负责数据排序的情况下或在该index情况下才有帮助。datatype: "json"datatype: "xml"

您应该尽可能减少网格内部的更改次数（或 HTML 页面上数据的任何其他更改gridComplete）loadComplete。如果一个元素发生一次更改，Web 浏览器必须重新计算页面上所有其他现有元素的位置。因此，页面上元素的更改可能会很昂贵。另一方面，gridview: true与格式化程序一起使用，rowattr回调（参见此处）或cellattr允许在将网格放置在页面上之前修改网格的 HTML 片段。以您获得最佳性能的方式。请参阅演示回调的相应代码示例的答案。rowattr

关于表演的最后一句话。代码jQuery("#" + rowIDs[i], $('#list2'))慢如jQuery("#" + rowIDs[i]). 原因是jQuery("#" + rowIDs[i])只使用id被索引的。所以它工作得很快。另一方面，代码jQuery("#" + rowIDs[i], $('#list2'))使用不允许使用HTML 页面索引的显式上下文。因此，简单扫描将用于执行速度较慢。

于 2012-10-01T10:40:08.170 回答