ExtJs GridPanel XML做数据源

1.xml文件内容：

 1 <? xml version="1.0" encoding="UTF-8" ?>
 2 < Data >
 3    < Items >    
 4      < TotalResults > 203 </ TotalResults >
 5      < TotalPages > 21 </ TotalPages >
 6      < Item >
 7        < ASIN > 0446355453 </ ASIN >      
 8        < Author > Jimmy.Yang </ Author >
 9        < Manufacturer > Warner Books </ Manufacturer >
10        < ProductGroup > Book </ ProductGroup >
11        < Title > Master of the Game </ Title >       
12      </ Item >
13      < Item >
14        < ASIN > 0446613657 </ ASIN >           
15        < Author > Sidney Sheldon </ Author >
16        < Manufacturer > Warner Books </ Manufacturer >
17        < ProductGroup > Book </ ProductGroup >
18        < Title > Are You Afraid of the Dark? </ Title >       
19      </ Item >
20   
21    </ Items >
22 </ Data >

 

2.ExtJs调用页面

 1 <! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
 2 < html  xmlns ="http://www.w3.org/1999/xhtml" >
 3 < head >
 4      < meta  http-equiv ="Content-Type"  content ="text/html; charset=utf-8" />
 5      < link  rel ="stylesheet"  type ="text/css"  href ="../resources/css/ext-all.css"   />
 6       < script  type ="text/javascript"  src ="../adapter/ext/ext-base.js" ></ script >
 7      < script  type ="text/javascript"  src ="../ext-all.js" ></ script >  
 8      < title > ExtJs_Grid_Xml </ title >
 9 </ head >
10 < body >
11
12 < script  type ="text/javascript" >  
13
14    Ext.onReady(function() {
15        
16        var store = new Ext.data.Store({           
17            url: 'GridData.xml',
18            reader: new Ext.data.XmlReader(
19                { record: 'Item' },                
20                ["ASIN","Author", "Manufacturer", "ProductGroup", "Title"])
21        });
22
23        
24        var grid = new Ext.grid.GridPanel({
25            store: store,
26            columns: [
27                { id: "ASIN", header: "出版号", width: 120, dataIndex: 'ASIN', sortable: true },
28                { header: "作者", width: 120, dataIndex: 'Author', sortable: true },
29                { header: "书名", width: 180, dataIndex: 'Title', sortable: true },
30                { header: "制作商", width: 115, dataIndex: 'Manufacturer', sortable: false },
31                { header: "产品组", width: 100, dataIndex: 'ProductGroup', sortable: false }],
32            renderTo: 'example-grid',
33            viewConfig: { columnsText: '显示列', sortAscText: '升序', sortDescText: '降序' },
34            width: 640,
35            height: 100
36        });
37
38        store.load();
39    });
40
41 </ script >
42
43 < div  id ="example-grid" ></ div >
44 </ body >
45 </ html >

转载于:https://www.cnblogs.com/Abel_cn/archive/2008/12/11/1353102.html