Json ExtJs加载数据_Json_Extjs_Gridpanel

Json ExtJs加载数据

json extjs

Json ExtJs加载数据,json,extjs,gridpanel,Json,Extjs,Gridpanel,我试图从imdb加载数据，但在表（GridPanel）中并没有结果。这是我的源代码： ... <body> <script type="text/javascript"> Ext.onReady(function(){ var store1 = new Ext.data.JsonStore({ root: 'root', idProperty: 'ID', remoteSort: true, fields: [ 'Ti

我试图从imdb加载数据，但在表（GridPanel）中并没有结果。这是我的源代码：

...
<body>
<script type="text/javascript">
 Ext.onReady(function(){

var store1 = new Ext.data.JsonStore({
    root: 'root',
    idProperty: 'ID',
    remoteSort: true,
    fields: [
        'Title'
    ],
    // load using script tags for cross domain, if the data in on the same domain as
    // this page, an HttpProxy would be better
    proxy: new Ext.data.ScriptTagProxy({
        url: 'http://www.imdbapi.com/?t=True%20Grit'
    })
});
 // building grid panel
});
</script>
<div id="topic-grid"></div>
...

。。。
Ext.onReady（函数（）{
var store1=new Ext.data.JsonStore({
根：'根'，
idProperty:“ID”，
remoteSort：是的，
字段：[
“头衔”
],
//如果跨域中的数据与跨域中的数据位于同一个域中，请使用脚本标记进行加载
//在这个页面上，HttpProxy会更好
代理：新Ext.data.ScriptTagProxy({
网址：'http://www.imdbapi.com/?t=True%20Grit'
})
});
//建筑网格面板
});
...

也许我应该更改JsonStore中的“root”参数

更新

我尝试使用HttpProxy，但仍然没有结果。我把全身的东西都放进去了，也许会更有帮助

<script type="text/javascript">
Ext.onReady(function(){

var store1 = new Ext.data.JsonStore({

    reader: new Ext.data.JsonReader({
        fields: ['Title'],
        root: 'rows'
        }),

    // load using script tags for cross domain, if the data in on the same domain as
    // this page, an HttpProxy would be better
    proxy: new Ext.data.HttpProxy({
        url: 'http://www.imdbapi.com/?t=True%20Grit'
    }),
    autoLoad: true
  });

var grid1 = new Ext.grid.GridPanel({
    width:700,
    height:500,
    title:'ExtJS.com - Browse Forums',
    store: store1,
    trackMouseOver:false,
    disableSelection:true,
    loadMask: true,

    // grid columns
    columns:[{
        id: 'Title', 
        header: "Topic",
        dataIndex: 'Title',
        width: 420,
        sortable: true
    }]
});


// render it
grid1.render('topic-grid');

// trigger the data store load
store1.load({params:{start:0, limit:25}});
});
</script>
<div id="topic-grid"></div>


Ext.onReady（函数（）{
var store1=new Ext.data.JsonStore({
阅读器：新的Ext.data.JsonReader({
字段：['Title']，
根：“行”
}),
//如果跨域中的数据与跨域中的数据位于同一个域中，请使用脚本标记进行加载
//在这个页面上，HttpProxy会更好
代理：新Ext.data.HttpProxy({
网址：'http://www.imdbapi.com/?t=True%20Grit'
}),
自动加载：正确
});
var grid1=新建Ext.grid.GridPanel({
宽度：700，
身高：500，
标题：“ExtJS.com-浏览论坛”，
店面：店面1，
trackMouseOver:false，
disableSelection:正确，
loadMask：是的，
//网格柱
栏目：[{
id:'标题'，
标题：“主题”，
数据索引：“标题”，
宽度：420，
可排序：正确
}]
});
//渲染它
grid1.呈现（“主题网格”）；
//触发数据存储加载
加载（{params:{start:0，limit:25}}）；
});

使用ScriptTagProxy时，无法直接从响应中获取JSON。您只能获取可执行的javascript，不幸的是，imdbapi站点不返回可执行的javascript。此外，您不能使用HttpProxy执行跨站点脚本（XSS）。您只能连接到自己本地域上的资源（如文件）

你有一种可能：

在您自己的域上设置代理将连接到的服务器端文件

使用与服务器端文件联系的HttpProxy，而不是ScriptTagProxy

proxy: new Ext.data.HttpProxy({
    url: '/path/to/my/server/file?t=True%20Grit'  // the leading slash in 
                                                  // this url will begin from
                                                  // your web server's root
                                                  // directory for your
                                                  // web-accessible files
})

让服务器端文件代表客户机进行imdb api调用，并将imdb api的结果作为JSON输出回客户机

myServerSideFile
================

// harvest GET parameters, e.g., in your case, the query param 't' with value
// True%20Grit

// use the GET parameters to form a url with the GET params on the end, e.g.,
// in your case, http://www.imdbapi.com/?t=True%20Grit

// call the imdb api using this url

// return the imdb api results as a JSON

有关在各种服务器端技术中执行上述建议的更多详细信息和示例，请参阅。

-1仅提及一个PHP示例。还有更多的服务器端语言可用，这个问题没有用PHP标记。不应提及具体的语言。如果你解决了这个问题，我将把它改为+1。@Ryan，谢谢你提供的信息，但我仍然得到空表。我粘贴了更新后的代码。问题是您正在尝试执行跨站点脚本（XSS），这无法由HttpProxy执行。我的建议是，在您的域上创建一个服务器端文件，并使用HttpProxy连接到该文件。然后，该服务器端文件将在后台进行imdbapi调用，然后将结果作为JSON返回给HttpProxy。因此，最终，您的HttpProxy不会直接连接到imdbapi:）谢谢@Ryan，但最后我通过从imdb获取XML数据并使用XMLReader解决了这个问题