5

我有Ext.grid.Panel一个函数，它返回一个自定义类，该类用于通过覆盖 getRowClass 函数来对网格中的行进行颜色编码。这很好用，但我想让用户选择更改网格着色的标准。在下面的示例中，我通过“严重性”属性着色，但例如，我想将其更改为“状态”。有没有一种方法可以动态更改getRowClass功能，或者网格上的整个视图配置，并在网格已经渲染后让网格重新着色？

alarmsGrid = Ext.create('Ext.grid.Panel', {
    title: 'Netcool Alarms',
    id: 'Netcool Alarms',
    columnLines: true,
    store: alarms_store,
    loadMask: true,
    stripeRows: true,
    features: [alarmsGroupingFeature],
    viewConfig: {
        getRowClass: function(record, rowIndex, rowParams, store){
          return record.get('severity').toLowerCase();
        }
    },
4

2 回答 2

4

这仅仅是因为您以错误的方式进行操作。几乎所有类型的配置对象只在类的实例化时相关，之后不会有任何影响。所以你需要让视图实例本身直接改变那里的属性（方法）。要从评论中举出你的例子，你需要像这样写

alarmsGrid.getView().getRowClass = function(record, rowIndex, rowParams, store){ 
     return record.get('status').toLowerCase(); 
}

见JSFiddle

于 2012-12-29T06:47:00.490 回答
3

根据Ext.grid.View 的 ExtJs 文档 （我刚刚测试成功！）getRowClass您可以在初始viewConfig没有问题的情况下提供回调函数！

我意识到这是一篇较旧的帖子，但您可能需要考虑debugger在上述代码中插入一条语句并逐步执行回调。您可能会发现其他问题，例如您拼错了模型字段名称，或者在null调用此属性时该属性具有值。

同样从您上面的代码看来，您正在将分组功能与您的网格一起使用，这将改变此功能的 HTML 标记。因此，行类可能位于<tr>比您预期的更深的嵌套元素上！您可以通过更改getRowClass回调函数来测试这一点，以返回一个易于搜索的唯一类名，如“this-is-a-test”。

然后返回并再次测试，使用您的调试器语句验证正在调用回调。然后使用您最喜欢的浏览器开发工具，在页面源代码中搜索您独特的测试类，以查看它实际应用于哪个 HTML 元素。

更新：哈，哈输入此内容后，我意识到我完全读得太快了，您确实说“渲染后”。让我恼火的部分是接受的答案说你“做错了”，这不一定是真的。在视图已经呈现之后，对于更改整个回调函数，接受的答案仍然是正确的。

但是，根据每个不同回调的复杂程度，您最好还是不要更改整个回调，而只更改回调中使用的标准。根据您的应用程序，两种方法都不一定比另一种更好。如果它就像'status'用另一个字段名称切换字段一样简单，那么您最好删除硬编码的引用并在视图上使用可以更改的变量，而不是重新声明一堆不同的回调并将它们切换进出.

于 2014-02-04T17:59:00.430 回答