如何在选择时将 ComboBox 项“id”设置为网格中的另一列？答案

【问题标题】：How to set ComboBox item 'id' to another column in grid on select?如何在选择时将 ComboBox 项“id”设置为网格中的另一列？
【发布时间】：2012-10-02 22:41:53
【问题描述】：

我们在模型中存储了这样的字段：

fields: ["name_id", "name"]

我们有这样的列的网格：

me.columns = [
    {
       header:"Name", 
       dataIndex:"name_id", 
       hide: true
    },
    {
       header:"Name", 
       dataIndex:"name", 
       xtype: 'combocolumn',
       editor: {
          xtype:'NameCombo',
          dataIndex:"name_id"
       },
       filter: true
    },
]

其中xtype NameCombo定义为：

Ext.define("NameCombo",{
    extend: "Ext.form.ComboBox",

    triggerAction: 'all',
    displayField: 'name', 
    valueField: 'id',
    lazyRender: true,
    editable: false,
    store: "Store",
    alias: ['widget.NameCombo'],
});

谁能告诉我，如何将 ComboBox 项 'id' 设置为我在配置中通过 NameCombo 中的 'dataIndex:"name_id"' 设置的另一列？

【问题讨论】：

标签： extjs extjs4

【解决方案1】：

我有唯一的解决方案。

如果我们改变 NameCombo 小部件，如下所示，我们可以将 'id' 设置为记录的另一个字段。

Ext.define("NameCombo",{
    extend: "Ext.form.ComboBox",

    displayField: 'name', 
    valueField: 'name',
    keyField: 'id',

    triggerAction: 'all',
    lazyRender: true,
    editable: false,
    store: "Store",
    alias: ['widget.NameCombo'],

    initComponent: function(){
        var me = this;

        me.listeners = {
            select: me.itemChanged
        };

        this.callParent();
    },

    itemChanged: function(combo, records, eOpts)
    {
        var me = this;

        Ext.Array.each(records, function(record) {
            if (me.dataIndex) {
                var grid = me.scope;
                var sm = grid.getSelectionModel();
                var lastRow = sm.getLastSelected();                 
                var columns = me.scope.columns,
                    i, columnsLength, column;           
                var id = record.data[me.keyField];

                lastRow.set(me.dataIndex,id);

                //TODO: Is there any simple way to update the value in the column of the grid?
                for (i = 0, columnsLength = columns.length; i < columnsLength; i++) {
                    column = columns[i];
                    if (column.dataIndex === me.dataIndex) {
                        column.getEditor().setValue(id);
                    }
                }
            }
        })

});

还有更好的解决方案吗？

【讨论】：