Ext.onReady(function(){
var MyRecord=Ext.data.Record.create([
{name:'name'},
{name:'org'},
{name:'homepage'}
]);
var myReader=new Ext.data.XmlReader({
totalRecords:"results",
record:"row",
id:'id'
},MyRecord);
var myProxy=new Ext.data.HttpProxy({
url: 'hello.xml',
failure:function()
{
Ext.Msg.alert("提示","下载数据失败");
}
});
var mystore=new Ext.data.Store({
proxy:myProxy,
reader:myReader
});
var colM=new Ext.grid.ColumnModel([
{header:"项目名称",dataIndex:"name",sortable:true},
{header:"开发团队",dataIndex:"org",sortable:true},
{header:"网址",dataIndex:"homepage"}
]);
var grid=new Ext.grid.GridPanel({
renderTo:"hello",
title:"XXXX",
height:200,
width:600,
cm:colM,
store:mystore,
autoExpandColumn:2
});
mystore.load();
});
html中加入下面的一行
<div id=”hello”></div>
hello.xml文件如下所示:
<?xml version=”1.0″ encoding=”UTF-8″ ?>
<dataset>
<row>
<id>1</id>
<name>jfox</name>
<org>huihoo</org>
<homepage>www.huihoo.org</homepage>
</row>
<row>
<id>2</id>
<name>jdon</name>
<org>jdon</org>
<homepage>www.jdon.com</homepage>
</row>
<row>
<id>3</id>
<name>springside</name>
<org>springside</org>
<homepage>www.springside.org.cn</homepage>
</row>
</dataset>
分享到:
相关推荐
ExtJs GridPanel双击事件获得双击的行,双击行可以选中前面的checkbox,并获得行号
本人自己写的Extjs入门教程,上面实现了treePanel和GridPanel的集成和交互。
通过Servlet让Extjs GridPanel 显示数据库数据
extjs读取解析后端json格式数据并显示条形图,非常好看的特效,只能用炫酷来形容,感兴趣就下载看看吧,用在自己的网站觉得吸引眼球!
ExtJS的GridPanel导出excel文件,方便快捷易懂!
extjs+xml 的可视化工作流设计器
此文件用于项目首页内容,使用了ExtJs中的GridPanel
Extjs2.02 Gridpanel加载本地数组资源的实例,思路相当清晰。对初学者很有用
php+extjs+grid实时显示更新数据
基于EXTJS 4.2 MVC环境搭建,并从后台获取数据在extjs Grid上显示出来
NULL 博文链接:https://aa00aa00.iteye.com/blog/564647
该文件中包含了一些实例:如何加载数据到extjs
extjs_02_grid显示本地数据、显示跨域数据_.docx
NULL 博文链接:https://swordboy007.iteye.com/blog/1722145
Extjs4 表单从数据库读取数据映射到对应的字段中显示
extjs 进度条的显示
使用extjs4+servlet对extjs中grid数据进行填并实现增删改查等功能!
Extjs DateField控件 - 只选择年份(找了很久发现网上只有选择年月的控件,于是基于extjs年月控件设计了只选择年份的控件)
主要介绍了Extjs4实现两个GridPanel之间数据拖拽功能具体方法,有需要的朋友可以参考一下
NULL 博文链接:https://topbox163.iteye.com/blog/1276463