Extjs 4 组合框第一次未加载（在使用表单数据设置组合之后）

Question

我在 window->form->combo 中有组合框，我使用 form.loadRecord(record) 将数据从网格绑定到组合。

我的问题是：

绑定数据后，我触发combo改变combo数据，第一次combo扩展小，第二次点击后自动隐藏，只有combo项加载正确。

{
    xtype: 'combobox',
    editable: false,
    id: 'USERTYPECmbo',
    queryMode: 'remote',
    displayField: 'USERTYPE',
    store: Ext.create('Ext.data.Store', {
        autoLoad: true,
        fields: ['USERTYPE'],
        proxy: {
            type: 'ajax',
            extraParams: {
                typeName: 'USERTYPE'
            },
            url: 'USERTYPE.htm',
            reader: {
                type: 'json',
                root: 'res'
            }
        },
        listeners: {
            load: function (store, options) {
                var combo = Ext.getCmp('USERTYPECmbo');
                combo.setValue(combo.getValue()); //Set the remote combo after the store loads.
            }
        }
    }),
    name: 'USERTYPE',
    fieldLabel: 'USER TYPE'
}

指出我哪里出错或需要为组件添加任何属性。

Answer 1

尝试添加

queryMode: 'local' 

到您的组合框属性

Answer 2

这是因为 valueField 没有在您的配置对象中定义（而 displayField 已设置）。当 extjs 尝试加载您的组合时，他需要 value 和 display 字段才能正确显示您的组合，但在渲染时，您的 valueField 尚未设置，他正在等待发送到服务器的 ajax 请求并发送回响应。

在您的侦听器中，您正在设置尚未呈现的组合值。因此，当您第二次单击组合时，恰好在加载远程 JSON 之后，然后设置组合字段。

{
    xtype : 'combobox',
    editable : false,   
    id:'USERTYPECmbo',  
    queryMode: 'remote',
    displayField: 'USERTYPE', 
    valueField: 'USERTYPE',//set whatever field you like in your json                        
    store :new Ext.data.Store({
        autoLoad: true,
        fields: [ 'USERTYPE' ],
        proxy: {
            type: 'ajax',
            extraParams: {typeName : 'USERTYPE'},
            url : 'USERTYPE.htm',
            reader: {
                type: 'json',
                root : 'res'
            }
        }                       
    }),
    name : 'USERTYPE',
    fieldLabel: 'USER TYPE'
}

更新： 我没有注意到的一个问题是您使用 Ext.create 创建了商店，因此，extjs 会尝试两次获取您的 JSON（只需使用 firebug 检查它），而一个请求就足够了。只需使用 new 而不是 Ext .create.我在我的本地服务器上测试了你的代码并且它工作正常。如果你仍然有同样的问题，请提供一个下载链接到你的表单 js + html + Store 以便我可以查看你的代码。你可以下载我构建的测试文件在您的代码上并从here.tested 在 FF 6、opera 10 和 IE9 上工作