ExtJS读取xml数据并显示在GridPanel

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>