如何加载在ExtJS的内存Ajax响应 [英] how to load ajax response in memory in extjs
问题描述
如何将数据加载在内存中的ExtJS的。通过使用Ajax response.ajax响应给出一个JSON数据。 当我尝试加载到分页格它不显示任何东西。可任何一个你idea.its帮全给我
How to load data in memory in extjs .by using an ajax response.ajax response give an json data. when i try to load into paging grid it doesnt show anything .can any one you idea.its help full to me
var itemsPerPage = 10; // set the number of items you want per page
// i am creating a store to load data into memory
var store = Ext.create('Ext.data.Store', {
autoLoad: true,
fields:['id','name', 'email'],
pageSize: itemsPerPage, // items per page
proxy: {
type:'memory',
enablePaging: true,
reader: {
type: 'json',
root: 'users',
successProperty: 'success'
}
}
});
// i am creating a ajax request to get json data
Ext.Ajax.request({
url: 'app/data/users.json',
success: function(resp) {
var result = resp.responseText;
store.loadRawData(result);
},
});
// to view data in store
Ext.define('AM.view.user.list' ,{
extend: 'Ext.grid.Panel',
alias: 'widget.userlist',
title: 'All Users',
initComponent: function() {
Ext.create('Ext.grid.Panel', {
title: 'My Test Demo',
store:store,
columns: [
{ header: 'ID', dataIndex: 'id' },
{ header: 'Name', dataIndex: 'name' },
{ header: 'Email', dataIndex: 'email', flex: 1 }
],
width: 350,
height: 280,
dockedItems: [{
xtype: 'pagingtoolbar',
store:store, // same store GridPanel is using
dock: 'bottom',
displayInfo: true,
pageSize:5,
}],
renderTo: Ext.getBody()
});
this.callParent(arguments);
}
});
和我的JSON数据看起来像这样
and my json data look like this
{
"success": true,
"users": [
{"id": 1, "name": 'Ed', "email": "ed@sencha.com"},
{"id": 2, "name": 'Tommy', "email": "tommy@sencha.com"},
{"id": 3, "name": 'Tommy', "email": "tommy@sencha.com"},
{"id": 4, "name": 'Tommy', "email": "tommy@sencha.com"},
{"id": 5, "name": 'Tommy', "email": "tommy@sencha.com"},
{"id": 11, "name": 'Ed', "email": "ed@sencha.com"},
{"id": 12, "name": 'Tommy', "email": "tommy@sencha.com"},
{"id": 13, "name": 'Tommy', "email": "tommy@sencha.com"},
{"id": 14, "name": 'Tommy', "email": "tommy@sencha.com"},
{"id": 15, "name": 'Tommy', "email": "tommy@sencha.com"},
{"id": 21, "name": 'Ed', "email": "ed@sencha.com"},
{"id": 22, "name": 'Tommy', "email": "tommy@sencha.com"},
{"id": 23, "name": 'Tommy', "email": "tommy@sencha.com"},
{"id": 24, "name": 'Tommy', "email": "tommy@sencha.com"},
{"id": 25, "name": 'Tommy', "email": "tommy@sencha.com"},
]
}
推荐答案
您可能不应该使用内存代理直接除非你有它的一些特定的需要。将数据加载到使用JSON商店是与Ajax代理好听自动化一种很常见的事。
You probably shouldn't use a Memory proxy directly unless you have some specific need for it. Loading data into a store with JSON is a very common task that is automated nicely with an Ajax proxy.
放下你的手册 Ext.Ajax.request()
通话和改变你的代理
来一个Ajax代理:
Drop your manual Ext.Ajax.request()
call and change your proxy
to an Ajax proxy:
proxy: {
type: 'ajax',
url : 'app/data/users.json'
reader: {
type: 'json',
root: 'users',
successProperty: 'success'
}
}
此外,调用在
不正确。我感觉你应该阅读的ExtJS 4的应用程序体系结构教程和指南让您开始使用ExtJS的框架。他们是很好的概述,帮助我出来的时候,我开始使用ExtJS的4。(如果我看错了,你使用的是其他版本的ExtJS当然读取对应于您所选择的版本的教程和概述) initComponent
方法来创建()
Also, calling create()
in an initComponent
method is incorrect. I get the feeling you should read the ExtJS 4 app architecture tutorial and guide to get you started with the ExtJS framework. They're good overviews that helped me out when I was getting started with ExtJS 4. (If I've misread and you're using a different ExtJS version of course read the tutorial and overview that corresponds to your chosen version)
这篇关于如何加载在ExtJS的内存Ajax响应的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!