从ExtJS网格面板的URL加载静态JSON数据

时间:2011-11-14 18:41:17

标签: json extjs gridpanel http-proxy jsonstore

我尝试使用来自JSON文件的数据实现网格面板,该文件与包含ExtJs代码的Javascript文件位于同一个域中。我正在使用ExtJs 3.4。

网格显示但没有任何数据。 Firebug显示一条错误消息,告诉我JSON文件的第一行中存在错误(“格式不正确”)。我已经验证了JSON文件,一切正常。

这是我的代码:

Ext.onReady(function () {
    var myStore = new Ext.data.JsonStore({
        url: 'data.json',
        root: 'rows',
        autoLoad: true,
        fields: [{
            name: 'person',
            type: 'string'
        }, {
            name: 'product',
            type: 'string'
        }]
    });

    var grid = new Ext.grid.GridPanel({
        id: 'gridPanel',
        title: 'Grid example',
        width: 250,
        height: 250,
        renderTo: 'grid-example',
        store: myStore,
        columns: [{
            header: 'Person',
            dataIndex: 'person'
        }, {
            header: 'Product',
            dataIndex: 'product'
        }]
    });
});

我的JSON数据是:

{
    "rows": [{
        "person": "Jamie Avins",
        "product": "Ladder"
    }, {
        "person": "Ed Spencer",
        "product": "Spanner"
    }]
}

你有什么想法吗?有人可以给我一些提示吗?

提前致谢!

Seha

2 个答案:

答案 0 :(得分:1)

使用:

reader: {
    type: 'json',
    root: 'rows'
}
在您的JsonStore

并验证您的json响应。

希望它对你有用。

答案 1 :(得分:0)

我测试了您的代码以及从您的示例中剪切并粘贴的确切JSON字符串。使用Grails返回字符串(不是从文件中读取)它工作得很好。萤火虫没有抱怨。看起来文件本身可能是问题,也许隐藏的角色正在蔓延。