Extjs 4组合框第一次没有加载(在使用表单数据设置组合后)

时间:2011-09-20 15:47:25

标签: extjs extjs4

我在window-> form-> combo中使用了combobox,iam使用form.loadRecord(record)将数据从网格绑定到组合。

我的问题是:

绑定数据后,我触发组合更改组合数据,第一次组合展开很少并在第二次点击后自动隐藏只有正确加载的组合项目。

{
    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'
}

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

2 个答案:

答案 0 :(得分:6)

尝试添加

queryMode: 'local' 

到您的组合框属性

答案 1 :(得分:4)

这是因为未在配置对象中定义valueField (设置了displayField时)。当extjs尝试加载你的组合时,他需要值和显示字段才能正确显示你的组合,但在渲染时,你的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上工作。在FF 6和opera 10和IE9上测试