Question

我使用jQgrid从服务器加载数据一次，使用xml格式的webservice，之后使用jqgrid的排序功能。首先正确加载数据，但是当我使用排序时，每行中的数据都被加扰，这意味着每行中的数据不正确。完成排序，但是对于每一列，来自另一行的数据都放在每一行中。这是我的代码：

 $.ajax({
        type: "POST",
        url: "WebService.svc/getInfoXML",
        dataType: "json",
        data: vdata,
        contentType: "application/json; charset=utf-8",
        success: function (json) {
            var data = json.d;
            jQuery("#tblDevs").jqGrid({
                datatype: 'xmlstring',


                datastr: data,

                colNames: [x1, x2, x3,x4],
                colModel: [
                                { name: 'devSerial', index: 'devSerial', hidden: true, width: 20, sortable: false },
                                { name: 'devName', index: 'devName', width: 100, sorttype: "string" },
                                { name: 'groupName', index: 'devSerial', hidden: true, width: 20, sortable: false },
                                { name: 'speed', index: 'speed', width: 70, sorttype: "number" },
                                { name: 'Date', index: 'Date', width: 115, sorttype: "string" },
                         ],
                viewrecords: true,
                direction: gridDirection,
                multiselect: false,
                rowNum: -1,
                rowTotal: 100000,
                width: 740,
                loadonce: true,
                sortable: true,
                gridComplete: function (rowId, rowData, rowElem) {


                    var grid = $("#tblDevs");
                    var rowData = grid.jqGrid('getDataIDs');
                    try {
                        for (var i = 0; i < rowData.length; i++) {
                            var emsStatus = jQuery("#tblDevs").getCell(rowData[i], "statusCode");
                            changeDevTableColor(emsStatus, rowData[i]);

                        }
                    }
                    catch (err) {

                    }
                },
                scrollrows: true,
                onSelectRow: function (id) {
                    var serial = jQuery("#tblDevs").getCell(id, "devSerial");
                    locate(serial);
                }


            });

function changeDevTableColor(emsStatus, rowId) {
    if (emsStatus == 6) {
        $("#tblDevs").jqGrid('setRowData', rowId, false, 'missionStyle6');
    }
    else if (emsStatus == 7) {
        $("#tblDevs").jqGrid('setRowData', rowId, false, 'missionStyle7');
    }
    else if (emsStatus == 8) {
        $("#tblDevs").jqGrid('setRowData', rowId, false, 'missionStyle8');
    }
    else if (emsStatus == 9) {
        $("#tblDevs").jqGrid('setRowData', rowId, false, 'missionStyle9');
    }
    else if (emsStatus == 10) {
        $("#tblDevs").jqGrid('setRowData', rowId, false, 'missionStyle10');
    }
    else if (emsStatus == 11) {
        $("#tblDevs").jqGrid('setRowData', rowId, false, 'missionStyle11');
    }
    else if (emsStatus == 12) {
        $("#tblDevs").jqGrid('setRowData', rowId, false, 'missionStyle12');
    }
    else if (emsStatus == 13) {
        $("#tblDevs").jqGrid('setRowData', rowId, false, 'missionStyle13');
    }
    else {
        $("#tblDevs").jqGrid('setRowData', rowId, false, 'missionStyle14');
    }
}

示例输出

<?xml version='1.0' encoding='utf-8'?>
<invoices>
    <rows>

        <row>
            <cell>63101</cell>
            <cell>3713</cell>
            <cell>-----</cell>
            <cell>1.26</cell>
            <cell>1394/12/12 21:44:57</cell>
            <cell>جنوب شرقی</cell>
            <cell>38</cell>
            <cell>309070</cell>
            <cell>140542</cell>
            <cell>حرکت از محل حادثه</cell>
        </row>
        <row>
            <cell>63100</cell>
            <cell>3723</cell>
            <cell>-----</cell>
            <cell>0.17</cell>
            <cell>1395/01/31 13:21:55</cell>
            <cell>جنوب شرقی</cell>
            <cell>22</cell>
            <cell>76343</cell>
            <cell>143153</cell>
            <cell>حالت نامشخص</cell>
        </row>
        <row>
            <cell>60814</cell>
            <cell>3724</cell>
            <cell>-----</cell>
            <cell>68.39</cell>
            <cell>1394/12/07 16:37:00</cell>
            <cell>شمال شرقی</cell>
            <cell>99</cell>
            <cell>221504</cell>
            <cell>139486</cell>
            <cell>رسیدن به بیمارستان</cell>
        </row>
        <row>
            <cell>63102</cell>
            <cell>3733</cell>
            <cell>-----</cell>
            <cell>7</cell>
            <cell>1395/02/04 15:15:47</cell>
            <cell>شمال</cell>
            <cell>98</cell>
            <cell>246200</cell>
            <cell>0</cell>
            <cell>حالت نامشخص</cell>
        </row>
        <row>
            <cell>60975</cell>
            <cell>60975</cell>
            <cell>-----</cell>
            <cell>0.2</cell>
            <cell>1394/03/19 12:59:03</cell>
            <cell>شرق</cell>
            <cell>99</cell>
            <cell>14440</cell>
            <cell>0</cell>
            <cell>حالت نامشخص</cell>
        </row>
        <row>
            <cell>63336</cell>
            <cell>63336</cell>
            <cell>-----</cell>
            <cell>0.02</cell>
            <cell>1394/03/19 10:39:59</cell>
            <cell>شمال غربی</cell>
            <cell>0</cell>
            <cell>0</cell>
            <cell>0</cell>
            <cell>حالت نامشخص</cell>
        </row>

    </rows>
</invoices>

提前致谢

Answer 1

我无法重现您使用jqGrid 4.4.1（请参阅the demo）或使用GitHub中的最新免费jqGrid（请参阅another demo）描述的问题。顺便说一句，我替换了代码，你用它来设置类取决于statusCode列（网格中不存在的列）的值和rowattr callabck

rowattr: function (item) {
    var className;
    if (6 <= item.statusCode && item.statusCode <= 13) {
        className = "missionStyle" + item.statusCode;
    } else {
        className = "missionStyle14";
    }
    return { "class": className };
}

并为旧的jqGrid添加了gridview: true选项以提高性能。无论如何，我无法重现数据排序的任何问题。

在本地使用jQgrid对数据进行排序

1 个答案: