EXTJS Combobox - 商店确实加载但没有显示

时间:2012-07-24 11:13:44

标签: extjs extjs4

鉴于以下javascript:

var fo = Ext.create('Ext.form.Panel', {
    layout:'box',
    ...
    items: [{
        xtype: 'combobox',
        valueField: 'id',
        displayField: 'organizationtype',
        store: {
            storeId: 'zaza',                
            fields: [{name: 'id'}, {name: 'organizationtype'}],
            root: 'data',
            autoLoad: true,
            proxy: {
                type: 'ajax',
                url: '/apps/crm_organizations/orgtype/',
                reader: {
                    type: 'json'
                }
            }
        },
        fieldLabel: 'Type relation',
        name: 'organizationtype',
        queryMode: 'local',
    },
            ...

此面板包含 - 以及其他字段 - 也是此组合框。我可以通过wireshark看到实际查询了url'/ apps / crm_organizations / orgtype /'。然而,组合框没有显示任何值。这与我懒惰加载组合框的事实有什么关系吗?

这是对JSON请求的响应:

{data: [ {id:"1" ,organizationtype:"Customer"} 
,{id:"2" ,organizationtype:"Relation"} 
,{id:"3" ,organizationtype:"Supplier"} 
,{id:"4" ,organizationtype:"Unknown"} ]}

3 个答案:

答案 0 :(得分:0)

你必须将root设置为你正在使用的json阅读器,默认为“”,你的应该是:

reader: {
                    type: 'json',
                    root: 'data'
                }

您也可以考虑使用模型对象替换字段配置。(来自docs)字段:通常应该避免使用此配置选项,它是为了向后兼容而存在的

答案 1 :(得分:0)

将组合框模式从本地更改为远程mode: 'remote'并使用json store:

store: {
    xtype: 'jsonstore',
    url: '/apps/crm_organizations/orgtype/',
    autoLoad: true,
    idProperty: 'id',
    root: 'data',
    fields: ['id','organizationtype'],
},
mode: 'remote'

答案 2 :(得分:0)

在您的商店中,您错过了根属性

store: {
  storeId: 'zaza',       
  fields: [{name: 'id'}, {name: 'organizationtype'}],
  root: 'data',
  autoLoad: true,
  proxy: {
    type: 'ajax',
    url: '/apps/crm_organizations/orgtype/',
    reader: {
      type: 'json',
      root:'data'
    }
  }
}

如果你的组合是跨域的查询信息,那么使用jsonp配置并使用远程查询来获得更好的性能