EXT读取XML数据

阅读更多
先来个数据
 1 xml version="1.0"  encoding="utf-8" ?>
 2 < items >
 3      < item >
 4          < id > 1 id >
 5          < name > DaiXiaosheng name >
 6          < sex > men sex >
 7      item >
 8      < item >
 9          < id > 2 id >
10          < name > Dai name >
11          < sex > men sex >
12      item >
13      < item >
14          < id > 3 id >
15          < name > xiaoshengDai name >
16          < sex > men sex >
17      item >
18      < item >
19          < id > 4 id >
20          < name > xiao name >
21          < sex > men sex >
22      item >
23 items >

再来个类
 1 /**/ /*XmlGrid samples*/
 2
 3 XmlGrid  =   function (config) {
 4    config = config || {};
 5    
 6    this.cm = new Ext.grid.ColumnModel([
 7        { header:'id' , dataIndex:'id' },
 8        { header:'name' , dataIndex:'name' },
 9        { header:'sex' , dataIndex:'sex' }
10    ]);
11    
12    this.store = new Ext.data.Store({        
13        url:'data.xml',
14        reader: new Ext.data.XmlReader({
15            record:'item',
16            id:'id',
17            totalRecords:'@total'
18            
19        }
,[
20            {name:'id',mapping:'id'},
21            {name:'name',mapping:'name'},
22            {name:'sex',mapping:'sex'}            
23        ])    
24    }
);
25    
26    this.store.load();
27    
28    Ext.applyIf(config,{
29        width:400,
30        height:200,
31        frame:true,
32        border:true
33    }
);
34    
35    XmlGrid.superclass.constructor.call(this,config);
36}

37
38 Ext.extend(XmlGrid,Ext.grid.GridPanel, {} );
39
40
41 Ext.onReady( function () {
42    var xmlgrid = new XmlGrid();
43    xmlgrid.render('xml_main')
44}
);

渲染页面
Code
<%@ page language="java"  pageEncoding="UTF-8"%>
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  
<head>
    
<title>JsonGridtitle>    
    
<link rel="stylesheet" type="text/css" href="../extjs/resources/css/ext-all.css">
    
<script type="text/javascript" src="../extjs/adapter/ext/ext-base.js">script>
    
<script type="text/javascript" src="../extjs/ext-all.js">script>
    
<script type="text/javascript" src="../grid/XmlGrid.js">script>
  
head>  
  
<body> 
    
<div id="xml_main">div>
  
body>
html>


你可能感兴趣的:(EXT,XML,JavaScript,CSS,HTML)