jqgrid - jqGrid中idPrefix的用法

Question

给定一个用本地数据填充并使用idPrefix：“ custTable”选项创建的jqGrid，所有生成的行均在html id中获得前缀，即custTableRow_1 custTableRow_2等。是否需要将此idPrefix版本的id传递到jqGrid方法（如果是）是哪个？

例如使用deleteRowData删除行，是否需要前缀ID？ setRowData或addRowData怎么样？在第x行之后添加时，似乎需要为srcrowid参数添加前缀。多选行怎么样？

如果我使用行的前缀ID删除行，则该行会从显示中消失，但是当我重新加载网格时，删除项会再次出现在网格中，就像未被删除一样。不使用idPrefix时不会发生这种情况。

谢谢你的帮助。

Answer 1

引入了idPrefix选项，以使HTML页面上的ID保持唯一，即使您在该页面上具有从服务器加载的rowid之类的id。典型示例是从服务器加载数据的两个网格。让我们在数据库中有两个表，您可以在PRIMARY KEY的定义中使用IDENTITY或AUTOINCREMENT。在这种情况下，主键将在表中自动生成，并且在表内将是唯一的，但在表上则不会唯一。因此，如果您将主键用作网格的ID并将两个网格放在一页上，则ID可以重复。

要解决此问题，可以在第一个网格中使用idPrefix: "a"作为附加选项，在第二个网格中使用idPrefix: "b"。在本地情况下，jqGrid将在各处使用带前缀的id，但是如果将id发送到服务器，则前缀将被剪切。

因此，您将在所有回调（事件）和所有方法（如setRowData，addRowData等）中本地看到带有前缀的ID，但是在服务器端，这些ID会在发送到服务器之前立即删除前缀。

我建议您另外阅读another answer有关我今天发布的ID中的限制的信息。

更新：我浏览了您在jsfiddle上编写的代码，并在代码中发现了一些明显的错误。您当前的代码

1）使用错误的算法来生成新行的ID。例如下面的代码

// generic way to create an animal    
function newAnimal(collection, defaults) {
    var next = collection.length + 1;
    var newpet = {
        id : next,
        name: defaults.name + next,
        breed: defaults.breed
    };
    return newpet;
}

使用 collection.length + 1作为新ID。如果允许删除项目是错误的。通过添加两个项目，从那里删除一个项目，然后再添加一个新项目一次，以确保ID重复。除此之外，使用一些只会递增的变量更为安全。例如，您可以使用 $.jgrid.randId()哪个代码非常简单。

2）调用 addRowData并手动添加前缀（请参见下面的 dogsPrefix+newdog.id）。这是错误的，因为jqGrid将前缀再一次添加到行中。

// add dog button actions    
$('#dogAddAtEnd').click(function() {
    var newdog = newAnimal(dogs, dogDefaults);
    dogs.push(newdog);
    dogAdded();        
    dogsTable.jqGrid('addRowData', dogsPrefix+newdog.id, newdog);
});

可能还有更多问题，但是至少这些问题可以解释您所描述的问题。

更新2：我检查了您发布的 new demo。它仍然有线条

grid.jqGrid('addRowData', newanimal.id, newanimal,
            "after", prefix+ followingId);

和

dogsTable.jqGrid('addRowData', dogsPrefix+newdog.id, newdog);

必须固定到

grid.jqGrid('addRowData', newanimal.id, newanimal,
            "after", followingId);

和

dogsTable.jqGrid('addRowData', newdog.id, newdog);

不过，我在更改后测试了该演示，并发现了 addRowData， delRowData和 setRowData的代码中的错误。问题出在 delRowData的 the line和 setRowData的 the same line

var pos = $t.p._index[rowid];

可以固定为以下

var id = $.jgrid.stripPref($t.p.idPrefix, rowid), pos = $t.p._index[id];

我建议在 addRowData内加入

var id = rowid; // pure id without prefix

在 the line之前

rowid  = t.p.idPrefix + rowid;

的 addRowData。 addRowData的 Another tow lines

lcdata[t.p.localReader.id] = rowid;
t.p._index[rowid] = t.p.data.length;

应该更改为

lcdata[t.p.localReader.id] = id;
t.p._index[id] = t.p.data.length;

使用未加前缀ID的位置。

使用固定版本的 jquery.jqGrid.src.js的演示的修改后的代码，您可以测试 here。

稍后，我会将错误报告发布到 trirand，以将jqGrid通知开发人员。我希望该错误修复将很快包含在jqGrid的主要代码中。

另外，我建议您使用 $.jgrid.stripPref方法从行标识符中删除前缀。例如功能

//general delete selected 
function deleteSelectedAnimal(list, grid, prefix)
{
    var sel = grid.jqGrid('getGridParam', 'selrow');
    if (sel.length)
    {
        var gridrow = sel;  

        //get the unprefixed model id
        var modelid = gridrow; 
        if (prefix.length !== 0)
        {
           modelid = modelid.split(prefix)[1];     
        }                
        // make it a numeric
        modelid = Number(modelid);

        //delete the row in the collection  
        list = RemoveAnimal(list, modelid);

        //delete the row in the grid
        grid.jqGrid('delRowData', gridrow);
    }
}

your demo中的内容可以重写为以下内容

//general delete selected
function deleteSelectedAnimal(list, grid)
{
    var sel = grid.jqGrid('getGridParam', 'selrow'),
        gridPrefix = grid.jqGrid('getGridParam', 'idPrefix');
    if (sel !== null)
    {
        //delete the row in the collection
        // ??? the gogs list will be not modified in the way !!!
        list = RemoveAnimal(list, $.jgrid.stripPref(gridPrefix, sel));

        //delete the row in the grid
        grid.jqGrid('delRowData', sel);
    }
}

我不确定行 list = RemoveAnimal(list, $.jgrid.stripPref(gridPrefix, sel));或函数 RemoveAnimal是否可以实现所需的功能，但与jqGrid连接起来并不是问题。

关于您的代码的另一句话。您已经在将 id属性添加到网格的对象中使用了。它与 localReader.id中定义的名称相同。在这种情况下，来自 id属性的数据将用作网格行（ id）的 <tr>属性。本地 data参数会将 id另外保存到其他属性，这些其他属性是从 name项的 colModel属性构建的。所以我认为定义隐藏列是没有意义的

{ key: true, name: 'id', align: 'left', hidden: true }

如果您从使用的网格中删除 id列，则如何查看 the demo上所有停留的方式与以前完全一样。

更新3：按照我之前发布的错误报告 here的承诺。