Question

首先是代码的一小部分：

{                text: 'TipoVisitaID',
            hidden: true,
            dataIndex: 'TipoVisitaID',
            itemId: 'TipoVisitaID'
        }, {
            text: 'TIPO VISITA',
            flex: 1,
            sortable: true,
            align: 'right',
            dataIndex: 'TipoVisita',
            editor: {
                xtype: 'combo',
                allowBlank: true,
                store: allTiposVisita,
                valueField: 'Id',
                name: 'TiposVisitaCombo',
                itemId: 'TiposVisitaCombo',
                tpl: Ext.create('Ext.XTemplate',
                                    '<tpl for=".">',
                                        '<div class="x-boundlist-item">{Designacao}</div>',
                                    '</tpl>'),
                displayTpl: Ext.create('Ext.XTemplate', '<tpl for=".">', '{Designacao}', '</tpl>')
            }
        },

我希望achivie是这样的。

编辑行时，我希望组合的选定值为隐藏字段中的值。

这甚至可能吗？

我试过这样做:(在组合上）

value: Ext.ComponentQuery.query("#TipoVisitaID")[0] == null ? '' : Ext.ComponentQuery.query("#TipoVisitaID")[0].value

但它不起作用......

Answer 1

添加一个事件监听器来编辑网格上的事件，并从那里更新隐藏字段中的数据。编辑完成后将触发此事件。

grid.on('edit', function (editor, e){ 
     e.record.set('TipoVisitaID', e.value);
}

Answer 2

你在找这样的东西吗？

var theHidden = Ext.getCmp('TipoVisitaID');
var theCombo = Ext.getCmp('TiposVisitaCombo'); =
theCombo.on('change', function(combo, newValue, oldValue, e){
  theHidden.setValue(newValue);
});

Answer 3

我已经解决了这个问题。

{
            text: 'TIPO VISITA',
            flex: 1,
            sortable: true,
            align: 'right',
            dataIndex: 'TipoVisitaID',
            renderer: function (loader, response, active) {
                return active.raw.TipoVisita;
            },
            editor: {
                xtype: 'combo',
                allowBlank: true,
                store: allTiposVisita,
                valueField: 'Id',
                name: 'TiposVisitaCombo',
                itemId: 'TiposVisitaCombo',
                tpl: Ext.create('Ext.XTemplate',
                                    '<tpl for=".">',
                                        '<div class="x-boundlist-item">{Designacao}</div>',
                                    '</tpl>'),
                displayTpl: Ext.create('Ext.XTemplate', '<tpl for=".">', '{Designacao}', '</tpl>')
            }
        },

首先我将dataIndex更改为ID。但现在用户会看到ID而不是数据，这就是我使用渲染器以便用户看到数据而不是ID的原因。

然后我将侦听器'beforeedit'添加到我执行此操作的网格中：

Ext.ComponentQuery.query("#TiposVisitaCombo")[0].setValue(e.record.raw.TipoVisitaID);

因此使用ID设置组合的值（使其成为预先选择的组合）。

Sencha网格：隐藏列和组合框

3 个答案: