从ExtJs中的json文件中获取并显示数据

时间:2014-04-11 11:00:49

标签: json extjs

我是ExtJs的初学者,我正试图从json文件中获取并显示数据。

我用于此的代码:

Ext.onReady(function () {
Ext.define('User', {
        extend: 'Ext.data.Model',
        fields: ['id', 'name', 'email']
    });

    var store = new Ext.data.Store({
    model: 'User',
    proxy: {
        type: 'ajax',
        url : 'example.json',
        reader: {
            type: 'json'
        }
    },
    listeners: {
        load: function() {
            records = store.getRange()
            test = records[0].get('id')
            alert(test)
        }
    },
    autoLoad:true
});
});

这是json文件:

[
    {
        "id": 1,
        "name": "Ed Spencer",
        "email": "ed@sencha.com"
    },
    {
        "id": 2,
        "name": "Abe Elias",
        "email": "abe@sencha.com"
    }
]

问题是它没有显示警报中的任何数据。请帮我解决一下。提前谢谢。

2 个答案:

答案 0 :(得分:0)

您正在提醒商店本身。这是一个管理数据的对象,而不是数据本身。

尝试:

console.log(store.getRange())

getRange将获取存储在数组中的所有记录 我更喜欢console.log而不是alert,因为您可以更好地检查数据。

修改

嘿,我看到你提供的答案越来越接近你的解决方案了 您必须知道alert打破了代码链。因此,除非您放弃警报,否则它将停止执行代码。

要回答第二个问题,您可以执行此操作以在string中显示所需的结果。

var records = store.getRange();
alert( JSON.stringify(records) );

答案 1 :(得分:0)

您应该在商店中使用以下配置 autoLoad:true

示例代码

Ext.define("Demo.store.Users",{
extend: "Ext.data.Store",
model: "Demo.model.User",
proxy: {

        type: 'ajax',
        url: 'users-browse-remote.php',
        reader: {
             type    : 'json',
             root: 'Users'
         },


 },
autoLoad: true

});