3

我有点不确定如何执行以下操作:

我有一个网格面板,在其中一个字段上,我有一个自动完成功能,我的应用程序的这一部分工作正常。

网格面板中的自动完成

我想做的是:从自动完成列表中选择一个项目后,我想填充与该项目关联的“描述”数据并将其填充到适当的单元格中。

例如,“PartNum 3”返回的数据是:

{"PartNum":"PartNum 3","Description":"Description partnum 3"}

选择后,我希望在网格面板的“描述”单元格中更新“描述部分 3”。

现在,我有点困惑的是最好的方法是什么。第一种方法似乎是这里解释的“DOM”模型如何在 ExtJS Grid 中读取和设置特定单元格的值?. 另一种方法似乎更多的是“存储”解决方案,例如ExtJs ComboBox 的更新或重新加载存储

所以我的问题是我应该使用哪种方法,为什么?特别是,我想知道在后端执行添加操作时最好的方法是什么。

一些适用于 Gridpanel 和自动完成的“Store”方法的代码也非常受欢迎。

就当前代码而言,这是我的模型:

Ext.define('CustomerOrderLineGrid.model.COLInventoryPart', {
extend: 'Ext.data.Model'
, fields: ['Id', 'PartNum', 'Description']
, proxy: {
    type: 'ajax'
    , api: {
        read: '../InventoryPart/InventoryPartListAutoComplete'
          }
    //        , url: 'someUrl'
    , extraParams:
    {
        total: 50000
    }
    , reader: {
        type: 'json'
        , root: 'InventoryParts'
        , successProperty: 'success'
        , totalProperty: 'total'
    }
    , simpleSortMode: true
}

});

店铺是:

Ext.define('CustomerOrderLineGrid.store.COLInventoryParts', {
extend: 'Ext.data.Store',
model: 'CustomerOrderLineGrid.model.COLInventoryPart',
autoLoad: false
, pageSize: 200
, remoteSort: true
, remoteFilter: true
, buffered: true
, sorters: [{
    property: 'PartNum'
    , direction: 'ASC'
}]

});

部分观点是:

, editor: {
                xtype: 'combo'
                , store: 'COLInventoryParts'
                , displayField: 'PartNum'
                , typeAhead: true
                , width: 320
                , hideTrigger: true
                , minChars: 2
                , listeners:
                {
                    select: function (f, r, i) {
                       // CODE TO INSERT TO POPULATE DESCRIPTION FIELD
                    }
                }
            }
4

1 回答 1

1

请注意,您提供的链接适用于,并且您使用的是

我认为你最好的选择是在网格上监听编辑事件,如果编辑在 autoComplete 列上,那么在描述之一上设置值,这将是这样的:

...定义你的网格...

listeners: {
    edit: function(editor, e) {
              if(e.field === 'PartNum') {
                  //NOTE: You need a reference to the autocomplete store for this to work
                  var rec = store.findRecord('PartNum', e.value);
                  e.record.set('Description', rec.get('Description'));
              }
          }
}

...您的其余代码...

这假设您可以获得对自动完成正在使用的商店的引用,如果您现在没有它应该相当容易。

这应该让你开始。

于 2011-11-21T15:07:38.537 回答