Question

理想情况我会致电setRowData并让我的单元格格式器和rowattr功能重新运行， 但< / em> 在调用rowattr时不会重新运行单元格和setRowData函数（我不知道为什么，但这可能是另一个问题），所以setRowData不是对我来说真的很有用。

下一个最容易做的事情似乎是删除一行并使用相同的模型在同一位置重新添加一行。为此，我需要获取所选行行的rowid，以便我可以调用addRowData并指定其ID srcrowid中的行，'after'使用position。这就是我的想法：

$.jgrid.extend({ updateRow: function(rowid, model){ // get index from id var index = this.jqGrid('getInd', rowid); // note: my first row's index is 1 (is that normal?) if ( index == 1 ){ position = 'first'; srcrowid = 'n/a'; } else{ position = 'after'; srcrowid = _____ how to get rowid of row above selected row _____??? } // delete row this.jqGrid('delRowData', rowid); // insert at index this.jqGrid('addRowData', rowid, model.attributes, position, srcrowid); } });

如何获取所选行行的rowid？（有更简单的方法吗？这是一个糟糕的策略吗？）

注意：我正在使用backbone.js集合和模型

Answer 1

我发现更改行的最佳方法是使用setRowData而不是使用delRowData和addRowData。如果你知道rowid，那么你可以使用$("#" + rowid);（或者如果rowis有特殊字符，例如:，.，那么就$("#" + $.jgrid.jqID(rowid));）来获取<tr> {1}}元素。然后，您可以使用jQuery.addClass，jQuery.css，jQuery.attr来更改行的属性。

了解jqGrid在内部使用相同的方法非常重要，它需要来修改网格的元素。 rowattr的主要目标是另一个目标。在填充网格数据期间，有许多场景。可以为<td>和<td>创建DOM元素，并在网格中插入。主要问题是使用DOM时的性能。它构建字符串的速度要慢得多。此外，如果元素存在于HTML页面上（与断开连接的元素相反），DOM甚至会慢得多。如果从具有500行的网格中仅修改一个元素，则需要重新计算所有其他行的元素的位置。

由于问题，jqGrid首先以字符串格式构建网格的整个主体，然后使用一组{{1}分配所有<tr>和<td>元素}。它显着改善了网格填充的性能。有关其他信息，请参阅the answer。引入了格式化程序和回调innerHTML和cellattr，以便在以字符串格式构建网格主体期间自定义单元格和行属性。它为您提供定制的可能性，而不会降低性能。

另一方面，如果您需要来修改HTML页面上已经附加的行，那么使用字符串而不是DOM将没有任何优势。因此，我建议您直接使用rowattr，jQuery.addClass，jQuery.css。如果您需要更改多个类，分配多个css规则或多个属性，则应使用上述函数的一个调用。您可以使用jQuery.attr，jQuery.css的对象形式。

Answer 2

下面的updateRow扩展程序有效，但我最终使用。与Oleg谈到的原因不同（我认为这是有效的，你应该考虑的事情），但因为我有一个过于难以同步的过滤器提供程序（例如在软删除行之后，我现在需要确定如果新删除的状态与当前过滤器一致......并且这是一个非常简单的例子）。所以我只是按照过滤器提供商给我的数据，每次重新填充网格，我不喜欢，但我没有看到其他简单的选项。

就下面的扩展而言，这是我看到的优点/缺点：

优点：

易于使用
您只需依赖已定义的rowattr函数和单元格格式。你不必写两次。

缺点：

可能表现 - 见Oleg的回答
请添加您看到的任何内容

未知量：

表现？我不知道它的表现有多糟糕。使用不同的浏览器进行基准测试会很有趣。我没有看到任何问题，但我只有20行。我们假设我们正在处理500行并添加/删除类，并且调用.css()需要30毫秒，但使用该扩展程序需要300毫秒才能完成一个典型的＆＃39;机/浏览器。这将慢10倍，但对我来说这可能是值得的，因为我不必写两次。

这是扩展名：

$.jgrid.extend({
    updateRow: function(rowid, data){
        // get index from id
        var index = this.jqGrid('getInd', rowid);

        // note: my first row's index is 1 (is that normal?)
        if ( index == 1 ){
            position = 'first';
        }
        else{
            position = 'after';
            srcrowid = $(this).find('tr#' + rowid).prev()[0].id;
        }

        // delete row
        this.jqGrid('delRowData', rowid);

        // insert at index
        this.jqGrid('addRowData', rowid, data, position, srcrowid);
    }
});

jqGrid：更新一行并更新其格式化程序

2 个答案: