从json加载数据

时间:2012-06-11 08:48:03

标签: arrays extjs combobox store

我有数据可用我想加载如下:

{
"success": true,
"message": null,
"total": null,
"data": [{
    "clockTypes": ["_12", "_24"],
    "speedTypes": ["MPH", "KMPH"],
    "scheduleTypes": ["DEFAULT", "AUTO"]
}]}

我正常加载像这样的数据

Ext.define('MyApp.store.comboTimezone', {
extend: 'Ext.data.Store',

constructor: function(cfg) {
    var me = this;
    cfg = cfg || {};
    me.callParent([Ext.apply({
        autoLoad: true,
        storeId: 'MyJsonStore5',
        proxy: {
            type: 'ajax',
            url: 'json/timezone.json',
            reader: {
                type: 'json',
                root: 'data'
            }
        }
    }, cfg)]);
}});

现在我将时钟类型作为我的组合框中的一条记录。我怎么能得到两个记录:我的组合框中的_12和_24?

1 个答案:

答案 0 :(得分:0)

你的root应该...... data.clockTypes我想 - (虽然我不确定这是否会奏效。)

劫持ajax调用加载数据有点尴尬,因为这不是商店消费的正确格式(是吗?)

理想情况下,你想......

{
"success": true,
"message": null,
"total": null,
"data": [{
   name: "_12", name:"_24"]
}]}

constructor: function(cfg) {
var me = this;
cfg = cfg || {};
me.callParent([Ext.apply({
    autoLoad: true,
    storeId: 'MyJsonStore5',
    valueField:'name',
    displayField:'name',
    proxy: {
        type: 'ajax',
        url: 'json/timezone.json',
        reader: {
            type: 'json',
            root: 'data'
        }
    }
}, cfg)]);
}});

虽然这确实意味着你最终会有更多的ajax调用。或者,如果您已经从1 ajax调用中设置了3个组合框(我有点猜测这是您尝试做的事情),那么您需要根据来自的数据动态生成存储 一个Ext.request()

但是,如果你不能弄乱数据,那么我们可以......

    Ext.define('MyApp.store.comboTimezone', {
    extend: 'Ext.data.Store',

    constructor: function(cfg) {
        var me = this;
        cfg = cfg || {};
        Ext.define('TZ', extend: 'Ext.data.Model',
        fields: [{
            name: 'name'
        }])
        me.callParent([Ext.apply({
            autoLoad: true,
            model: 'TZ',
            storeId: 'MyJsonStore5',
            proxy: {
                type: 'ajax',
                url: 'json/timezone.json',
                reader: {
                    type: 'json',
                    root: 'data'
                }
            }
        }, cfg)]);
        //hacky, but works i guess
        Ext.Ajax.request({
            url: 'my.json',
            success: function(response) {
                var text = response.responseText;
                var json = Ext.JSON.decode(text);
                for(var i =0);i<json.data.lenght();i++;){
                    Ext.data.StoreManager.lookup('MyJsonStore5').add(Ext.create('TZ',{name:json.data[i]}))
                }
            }
        });
    }
});

*制造错误的拼写错误。

基本上你调用url,将数据作为原始json获取,然后将其处理为商店可以读取的格式。

不幸的是,它有点像黑客。