【问题标题】:Load static JSON data from URL for ExtJS grid panel从 URL 为 ExtJS 网格面板加载静态 JSON 数据
【发布时间】:2011-12-28 21:54:42
【问题描述】:

我尝试使用来自与包含 ExtJs 代码的 Javascript 文件位于同一域中的 JSON 文件中的数据来实现网格面板。我正在使用 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"
    }]
}

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

提前致谢!

塞哈

【问题讨论】:

  • 对 data.json 的调用是否已被触发?签入控制台
  • 嗨,bensiu,感谢您的提示。我将 autoLoad 设置为 true 并尝试了 myStore.load()。数据已加载,但 firebug 显示格式不正确。

标签: json extjs gridpanel http-proxy jsonstore


【解决方案1】:

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

【讨论】:

  • 您好约翰,谢谢您的回答。 “使用 Grails 返回字符串”到底是什么意思?我验证了 JSON 文件,其中没有隐藏字符。 Firebug 停在第一行,抱怨“格式不正确”标记第一个左大括号 {。
  • 动物,我使用 Grails 的意思是让 Grails 应用程序服务器返回字符串,而不是从文件中读取字符串。即使标记了左大括号,也有可能在文件的其他地方存在问题。也许 Firebug 不喜欢尾随换行,或者引号是特殊的卷曲 Word 类型而不是标准的直行。此外,Firebug 是获取整个字符串还是被截断或附加了一些内容?
  • 嗨约翰!不幸的是,我无法尽快回信。我解决了这个问题。我再次安装了服务器并更改了一些参考帖子sencha.com/forum/…的配置,之后一切都很好。
【解决方案2】:

用途:

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

在您的 JsonStore 中并验证您的 json 响应。

希望它对你有用。

【讨论】:

    猜你喜欢
    • 2012-06-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-08-24
    • 1970-01-01
    • 1970-01-01
    • 2011-02-15
    相关资源
    最近更新 更多