Ext JS DataIndex

Question

我使用ExtJS库创建了一个网格。

首先创建了一个模型：

Ext.define('Option', {
    extend: 'Ext.data.Model',
    idProperty: 'OptionId',
    fields: [
        { name: 'TradeDate' },
        { name: 'OptionType' }
    ]
});

第二步，我创建了列数组：

var allColumns = [
    {
        text: 'Option Id',
        width: 75,
        sortable: true,
        cls: 'grid-header-LadderStep',
        dataIndex: 'ExternalId',
        renderer: RenderColumn
    },
    {
        text: 'Trade Date',
        width: 65,
        sortable: true,
        cls: 'grid-header-LadderStep',
        dataIndex: 'TradeDate',
        renderer: RenderColumn
    }
]

在列列表中，renderer 事件定义如下：

function RenderColumn (value, metaData, record, rowIdx, colIdx, store, view) {
    metaData.style = 'background-color:#BBD5EE !important';
    return value;
};

如何从RenderColumn函数中获取我在列列表中定义的dataindex？

如果我描述的情况下，它可以是ExternalId或TradeDate。

我找到了一个解决方案：

grid.columns[colIdx].dataIndex

“grid”是一个全局网格变量。

- Gregory Nozik

Answer 1

好的，这个还没有被 Sencha 团队记录在文档中，但是它是可用的。您可以通过 grid 的 Ext.grid.View 上可用的 header container 方法来完成：

    renderer: function(val, meta, rec, rowIdx, colIdx, store, view) {
        var column = view.getHeaderAtIndex(colIdx);
        var dataIndex = column.dataIndex;
    }

这能够正常工作的原因是因为Ext.grid.View继承自Ext.table.View，后者拥有一个名为getHeaderAtIndex的公共方法，但该方法尚未被记录在文档中。

我发现某些内容尚未被记录在文档中，通过这个链接了解到。

- Ryan

---

等一下...这行不通，可能是索引不匹配...我会修正。 - Ryan

我该如何定义字段名称？ - Gregory Nozik

它在您的模型定义中。如果您查看fields配置选项，您会发现每个字段都是用name定义的。 - Ryan

是的，我正在查找Ext4是否公开了足够的信息。 - Ryan

Answer 2

您可以指定“defaultRenderer”，然后使用this.dataIndex。 像这样：

{
    text: 'Trade Date',
    width: 65,
    sortable: true,
    cls: 'grid-header-LadderStep',
    dataIndex: 'TradeDate',
    defaultRenderer: RenderColumn
}

现在你可以在你的渲染器中使用 this.dataIndex。

- Triqui