ExtJS如何在组合编辑器选择后强制渲染网格行答案

【问题标题】：ExtJS How to force render on grid row after combo editor selectExtJS如何在组合编辑器选择后强制渲染网格行
【发布时间】：2014-09-14 17:49:22
【问题描述】：

我的 ExtJS 4.2.1 应用程序中有一个带有以下可编辑列的网格：

text: 'Location',
    dataIndex: 'LocationId',
    width: 140,
    renderer: function(value) {
        var record = me.store.findRecord('LocationId', value);
        return record.get('Description');
    },
    editor: {
        xtype: 'combobox',
        typeAhead: true,
        triggerAction: 'all',
        store: Ext.create('App.store.catalog.Location', {
            autoLoad: true
        }),
        displayField: 'Description',
        valueField: 'LocationId',
        listConfig: {
            width: 250,
            loadingText: 'Searching...',
            // Custom rendering template for each item
            getInnerTpl: function() {
                return '<b>{Code}</b><br/>(<span style="font-size:0.8em;">{Description}</span>)';
            }
        }
    }

组合有一个renderer 来显示所选LocationId 的描述。

然后，我的网格具有 'Ext.grid.plugin.CellEditing' 功能，因此我可以只编辑该列单元格。

我遇到的问题是当我按下“Update”按钮时，即使记录中的LocationId具有正确的值，组合显示值也会恢复到原来的值。

这是我在用户按下“更新”按钮时触发的代码。

me.rowEditing = Ext.create('Ext.grid.plugin.RowEditing', {
    clicksToMoveEditor: 1,
    autoCancel: false,
    listeners: {
        edit: function(editor, e) {
            var record = e.record;

            me.setLoading('Updating...');

            App.util.Ajax.request({
                noMask: true,
                url: '/api/catalog/UpdateEmployeeLocation',
                jsonData: record.getData(),
                success: function(response, opts) {

                    var obj = Ext.decode(response.responseText);
                    if (obj.success) {

                        // commit changes (no save just clear the dirty icon)
                        me.getStore().commitChanges();
                    }
                },
                callback: function() {
                    me.setLoading(false);
                }
            });

        }
    }
});

记录已正确保存在我的数据库中，但组合显示值未使用与LocationId 对应的描述进行更新。如果我再次从服务器重新加载商店，那么它会正确显示。

所以，我的列中的renderer 有问题，在我更新记录后没有更新值。

关于如何解决这个问题的任何线索？

谢谢。

【问题讨论】：

标签： extjs extjs4 extjs4.1 extjs4.2 extjs-mvc

【解决方案1】：

您将 dataIndex 设置为“LocationId”，但没有更改“LocationId”的位置，您只是在更改描述并在渲染方法中更新它。由于“LocationId”没有变化，存储不会将其视为脏字段，因此不会调用渲染函数。一种快速而肮脏的方法可能不是使用“LocationId”，而是在模型中创建另一个字段，比如“LocationIdchangeTraker”。在数据索引中使用“LocationIdchangeTraker”而不是“LocationId”。它不会影响您的视图，因为您正在更改 reneerer 函数中的值。现在，每当您更新函数时，都会更改“LocationIdchangeTraker”的值，如下所示。

record.set('LocationIdchangeTracker',Ext.getId());

【讨论】：