Question

我在输入形式中使用组合时遇到了一个有趣的问题。我的表单包含从json存储中获取数据的组合。它在添加新记录时工作正常，但是当打开表单以编辑现有记录时，有时id显示为选中而不是其值（例如：有5而不是“apple”）。我认为它会在完成加载组合之前设置值。

我检查组合商店计数，它返回零，这意味着在加载组合之前完成选择。我尝试在load事件和fire select事件中设置值，但它不起作用当我在加载商店时重新选择另一条记录

时效果很好

我也看到了这个帖子，但它没有给出可行的答案 ExtJS combo setting problem

无论如何设置文本？

请问有人给我正确的解决方案吗？

Answer 1

您是否使用标准ExtJs方法setValue在comboBox中设置值？

检查你是否在Ext.onReady（...）中设置了值;

或者，如果您通过ajax加载值，则可以将带回调的update方法用作第三个参数（请参阅http://dev.sencha.com/deploy/dev/docs/ - ＆gt; ComboBox）

Answer 2

var partyType_store = new Ext.data.Store(
{
    autoLoad: false,
    autoDestroy: true,

    // Note that I have renamed the web service proxy class
    proxy: new Ext.data.HttpProxy({
        url: accounts.webService + '/GetType',
        // ASP.NET WebService call in GET format
        headers: {
            'Content-type': 'application/json'
        }
    }),

    fields: ['AccountTypeId', 'AccountTypeName'],
    listeners {
        load: function() {
            Ext.getCmp('cmbPartyType').setValue(Ext.getCmp("txtId").getValue());
            Ext.getCmp('cmbPartyType').fireEvent("select");
        }
    }
},

// Combo is defined as
{
    xtype: 'combo',
    width: 150,
    fieldLabel: 'Party Type',
    name: 'PartyType',
    id: 'accounts-cmbPartyType',
    store: partyType_store,
    displayField: 'PartyType',
    valueField: 'PartyTypeId',
    hiddenName: 'PartyTypeId',
    mode: 'local', // important property when using store
    typeAhead: true,
    triggerAction: 'all',
    selectOnFocus: true,
    allowBlank: true,
    forceSelection: true
}

我在事件说按钮点击事件

上加载组合商店

Ext.getCmp('cmbPartyType').getStore().load(); //this calls combo load event

如果我在商店中设置 autoLoad = true ，它可以正常工作但实际上我不想最初加载商店以减少流量，直到用户按下按钮

Answer 3

为什么模式设置为本地而不是远程？您是否使用过FireBug来确保从ASP服务发送的数据格式正确？

我对这两件商品的期待有点不清楚：
valuefield：'PartyTypeId'＆lt; - 这是一个数字还是一个acode？ 5？
displayField：'PartyType'＆lt; - 这是一个数字还是代码？苹果？

Answer 4

我一直在与这个战斗，我终于有了足够的。在加载任何组合之前在某处添加此hack（不必在文档准备好之后）

Ext.form.ComboBox.prototype.nativeSetValue = Ext.form.ComboBox.prototype.setValue;
Ext.form.ComboBox.prototype.setValue=function(v){
   var combo = this;
   if(this.valueField){
      var r = this.findRecord(this.valueField, v);
      if (!r) {
         var data = {}
         data[this.valueField] = v;
         this.store.load({
            params:data,
            callback:function(){
               combo.nativeSetValue(v);
            }
         })   

      } else return combo.nativeSetValue(v);
   } else combo.nativeSetValue(v);
}

这基本上会检查您的值是否在您的商店中，如果不是，请使用valueField = value进行回调，然后再次尝试设置。您只需要确保您的服务器端处理程序查找搜索的“查询”和负载的关键字段

Answer 5

有时它会显示为id，因为代码中有race condition。实际上，如果商店已加载，它将显示显示值，否则只显示id。

我在自己的代码中对此进行了测试。存储加载比Ajax调用快得多，以检索初始化值（因为我memcached第一次调用）。由于存储首先加载，因此使用Id调用setValue（）效果很好。

然而，当我试图特意减慢商店加载Ajax调用时，只显示了id而不是显示值。所以我看到答案告诉你要解决这个问题，你必须在ComboBox中使用 autoLoad：true 。使用autoLoad很好，但还不够。您希望确保在设置值时，商店已经加载。要做到这一点，只需在商店的load事件上放置一个监听器：

var dataStore = new Ext.data.JSonStore({
    url: 'your-url',
    root: 'records',
    fields: ['id', 'name'],
    autoLoad: true,
    listeners: { 
        load: function () {
            app.initForm(); //here the name of the function setting form values
        }
});

在这两种情况下，一切正常。

为防止在第一次运行后ComboBox触发新的load（）事件时重新加载数据，我正在检查是否在app.initForm（）中设置了值

app.initForm = function () {
    var customerField = Ext.getCmp('formName').getForm().findField('idCustomer');
    if (customerField.getValue !== '') {
        return; //skipping init, form already filled
    }
    //Ajax Call here
};

EXTJS组合设置问题

5 个答案: