javascript - jqGrid 在使用 addRowData 时总是突出显示第一行

Question

一直试图获取 rowID 无济于事，我突然意识到我的代码中存在一个影响 jqGrid 运行方式的错误。

我的代码如下:

function showSearchResults(k1,k2,k3,k4,k5){

jQuery("#list2").jqGrid(    {   datatype: function(pdata) {
        getData(pdata,k1,k2,k3,k4,k5);
    },
                            colNames:['title','section','Year','Month', 'Page', 'rank', k1,k2,k3,k4,k5],
                            colModel:[
                                        {name:'title',index:'title', width:300},
                                        {name:'section',index:'section', width:100},                                    
                                        {name:'yearEdition',index:'yearEdition', width:60, align:"center"},
                                        {name:'monthEdition',index:'monthEdition', width:60, align:"center"},
                                        {name:'pageNumber',index:'pageNumber', width:60, align:"center"},
                                        {name:'rank',index:'rank', width:100, align:"center"},
                                        {name:'keyword1',index:'keyword1', width:100, align:"center"},
                                        {name:'keyword2',index:'keyword2', width:100, align:"center"},
                                        {name:'keyword3',index:'keyword3', width:100,align:"center"},
                                        {name:'keyword4',index:'keyword4', width:100,align:"center"},
                                        {name:'keyword5',index:'keyword5', width:100,align:"center"}
                                    ],
                            rowNum:10,
                            rowList:[10,20,30],
                            pager: '#pager2',
                            sortname: 'id',
                            viewrecords: true,
                            sortorder: "desc",
                            loadonce:true,
                            caption:"Results" });

jQuery("#list2").jqGrid('navGrid','#pager2',{edit:false,add:false,del:false});

GetData 函数只是这样的:

function getData(pdata,keyword1,keyword2,keyword3,keyword4,keyword5) {

$.getJSON('addresshere?callback=?',
    {
        k1:keyword1,
        k2:keyword2,
        k3:keyword3,
        k4:keyword4,
        k5:keyword5,
        async:false
    },

    function (data) {
    var a = JSON.parse(data);

    if (a.length != 0)  {
        $.each(a, function (index, item)
                        {
                        var thegrid = jQuery("#list2"); 
                        thegrid.addRowData(0,item);
                        });
                        }
                    });
    }

从 WebService 返回行，填充网格都工作正常，但无论我在网格上的哪个位置单击，第一行始终突出显示。

是否有任何明显或已知的问题(例如字段名称与 jsGrid 代码冲突等)。

Answer 1

是的，当你说:

thegrid.addRowData(0,item);

您正在为网格中的每一行分配相同的 ID 0。

来自 addRowData 的文档:

Parameters

• rowid
• data
• position
• srcrowid

Description

Inserts a new row with id = rowid containing the data in data (an object) at the position specified (first in the table, last in the table or before or after the row specified in srcrowid) ...

This method can insert multiple rows at once. In this case the data parameter should be array defined as [{name1:value1,name2: value2…}, {name1:value1,name2: value2…} ] and the first option rowid should contain the name from data object which should act as id of the row. It is not necessary that the name of the rowid in this case should be a part from colModel.

由于您一次插入一行(而不是上面提到的多行)，因此您需要在调用 addRowData 时为每一行分配一个唯一的 ID。我建议您在网络请求中检索一个唯一 ID，并根据需要重构您的代码以分配该 ID:

 thegrid.addRowData(item.id, item);

如果您在后端没有唯一 ID，显然这是一个问题 - 虽然这可能表明存在更大的设计问题。在任何情况下，如果您无法检索 ID 变量，我建议您使用临时 JavaScript 变量为每一行分配一个不断增加的 ID:

var counter = 0;
...
    thegrid.addRowData(counter, item);
    counter++;
...

---

更新

正如 Oleg 指出的，您还可以将 undefined 作为 ID 传递，以允许 jqGrid 自动生成唯一的 ID。您可以从 grid.base.js 中源代码的相关部分看到这一点:

if(typeof(rowid) != 'undefined') { rowid = rowid+"";}
else {
    rowid = $.jgrid.randId();
    ...

我没有看到文档中提到此功能，因此使用它需要您自担风险。但话虽如此，这似乎是一个不错的功能，大概 jqGrid 团队没有理由删除。