为什么我不能使用JSONStore让简单的Combobox在EXTjs 4中工作?

cbm*_*eks 5 json combobox extjs extjs4

这让我疯了.我有一个JS文件:

  Ext.onReady(function(){
     Ext.QuickTips.init();

     var SitesStore = new Ext.data.JsonStore({
        autoLoad: true,
        fields: [{
           name: 'id',
           mapping: 'id'
        }, {
           name: 'name',
           mapping: 'name'
        }],
        proxy: {
           type: 'ajax',
           url : '/sites/getsites.do'
        },
        storeId: 'SitesStore',
        root: 'sites',
        url: '/sites/getsites.do',
        xtype: 'jsonstore'
     });

     SitesStore.load(function(data){
        Ext.create('Ext.form.ComboBox', {
           fieldLabel: 'Choose Site...',
           store: SitesStore,
           data: data[0].raw["sites"],
           queryMode: 'remote',
           displayField: 'name',
           valueField: 'id',
           renderTo: "timesheetSearch"
        });

        console.log(data[0].raw["sites"]);
     });

  }); //end onReady
Run Code Online (Sandbox Code Playgroud)

我以下列格式/sites/getsites.do返回JSON数据:

{
    -sites: [
        -{
            id: "12345678"
            name: "Blah Warehouse"
        },
        -{
            id: "5999B91DF6C0"
            name: "WalMart Warehouse"
        },
        ...
}
Run Code Online (Sandbox Code Playgroud)

我意识到data[0].raw["sites"]可能不是访问数据的首选方式,但我确认数据正在填充,我正在回来136 sites.

combobox DOES渲染.但是,实时搜索不起作用且没有条目.

我是ExtJS的新手.

任何提示将不胜感激.

谢谢

UPDATE

此代码WORKS

var SitesStore = Ext.create('Ext.data.Store', {
    autoLoad: true,
    fields: ['id','name'],
    data: [{'id':'aaaa', 'name':'Honeywell'}],
    storeId: 'SitesStore',
    root: 'sites'
});

Ext.create('Ext.form.ComboBox', {
    fieldLabel: 'Choose Site...',
    store: SitesStore,
    queryMode: 'remote',
    displayField: 'name',
    triggerAction: 'all',
    valueField: 'id',
    renderTo: "timesheetSearch"
});
Run Code Online (Sandbox Code Playgroud)

不是

var SitesStore = Ext.create('Ext.data.Store', {
    autoLoad: true,
    fields: ['id','name'],
    proxy: {
        type: 'ajax',
        url: '/sites/getsites.do'
    },
    storeId: 'SitesStore',
    root: 'sites'
});

Ext.create('Ext.form.ComboBox', {
    fieldLabel: 'Choose Site...',
    store: SitesStore,
    queryMode: 'remote',
    displayField: 'name',
    triggerAction: 'all',
    valueField: 'id',
    renderTo: "timesheetSearch"
});
Run Code Online (Sandbox Code Playgroud)

当我在没有proxy(并指定a url)的情况下运行它时,我得到一个错误,说我没有指定代理.

谢谢

UPDATE

啊!!!!!!

我知道了.这是正确的JSONStore

var SitesStore = Ext.create('Ext.data.Store', {
    autoLoad: true,
    fields: ['id','name'],
    proxy: {
        type: 'ajax',
        url: '/sites/getsites.do',
        reader: {
            type:'json',
            root: 'sites'
        }
    },
    storeId: 'SitesStore',
    root: 'sites'
});
Run Code Online (Sandbox Code Playgroud)

感谢大家.无法相信这有多难.主要是因为我找不到一个好的教程.大声笑

cbm*_*eks 1

更新

我能够弄清楚这一点。这是工作代码:

var SitesStore = Ext.create('Ext.data.Store', {
     autoLoad: true,
     fields: ['id','name'],
     proxy: {
        type: 'ajax',
        url: '/sites/getsites.do',
        reader: {
           type:'json',
           root: 'sites'
        }
     },
     storeId: 'SitesStore',
     root: 'sites'
  });

  Ext.create('Ext.form.ComboBox', {
     fieldLabel: 'Choose Site...',
     store: SitesStore,
     queryMode: 'remote',
     displayField: 'name',
     triggerAction: 'all',
     valueField: 'id',
     renderTo: "timesheetSearch"
  });
Run Code Online (Sandbox Code Playgroud)

我永远无法让 JSONStore 工作,因此我创建了一个标准Store,并且必须将reader属性与我的JSON数据相匹配。

希望这对某人有帮助。