`

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>

分享到:
评论
2 楼 lihuanxi 2011-02-24  
提示需要下一卷!
1 楼 lihuanxi 2011-02-24  
这个资源不能解压缩!

相关推荐

    extjs表格(表格后台数据读,分页),树(后台数据读取,复选框联动)的基本操作示例

    总结,这个示例展示了如何使用ExtJS的GridPanel和TreePanel组件,结合后台数据读取,实现分页显示表格数据和树形结构数据,以及复选框的联动效果。在Visual Studio 2008环境中,开发者可以编写和调试这些功能,为...

    extjs&使用grid显示数据参照.pdf

    在EXTJS中,GridPanel是一种强大的组件,常用于展示结构化的数据,类似于电子表格。它提供了用户友好的界面,能够方便地从服务器或数据库加载数据并进行显示。本章主要探讨如何利用GridPanel来实现这一功能。 首先...

    ExtJs中的Grid Title部分利用XML定义(ExtJS+Struts2)

    本教程将详细讲解如何在ExtJs中利用XML来定义Grid的Title部分,并通过Struts2 Action获取数据。 首先,让我们了解`ExtJs Grid Title`。Title是Grid面板的头部,通常用来展示Grid的标题或列名。在传统的定义中,我们...

    extjs实例~~~

    `Ext.data.Store 读取XML属性值.txt`可能介绍了如何从XML文件中提取数据并填充到Store中,以便在GridPanel或其他组件中使用。 3. **JsonStore**: JsonStore 是基于EXTJS的Store的一个子类,专为处理JSON格式数据...

    extjs3.0开发包含示例api

    4. **Ajax和数据存储(Ajax and Data Stores)**:提供了XML、JSON等格式的数据读取和写入,以及远程数据存储的实现,便于与服务器进行异步通信。 5. **拖放功能(Drag and Drop)**:EXTJS 3.0支持拖放操作,使得...

    Ext中用jxl导出全部数据和当前页数据的实现

    根据提供的文件信息,本文将详细解释如何在ExtJS框架中使用jxl库来实现出全部数据及当前页面数据的功能。 ### ExtJS与jxl简介 #### ExtJS ExtJS是一款基于JavaScript的开源前端框架,主要用于构建复杂的Web应用...

    Extjs4.0视频教程和源代码,另附文档翻译

    - **不同格式的支持**:讲解了Extjs支持的多种数据格式(如JSON、XML等),并介绍如何使用相应的读写器进行处理。 ### 数据集(Store) #### 第六讲: Extjs4.0的数据集(Store) - **Store的作用**:解释了Store在...

    Hibernate+Spring+Struts2+ExtJS开发CRUD功能实例

    开发者可以通过定义Store来连接后台数据源,GridPanel用于显示数据,FormPanel用于编辑和保存数据,而Ext.Ajax则用于发送异步请求。 总的来说,这个实例展示了如何将这些技术结合在一起,形成一个完整的Web应用开发...

    extjs 2.0精编教程--民间版

    5. **数据存储与数据绑定**:ExtJS的数据模型(Model)和数据存储(Store)系统支持JSON、XML、CSV等多种数据格式,方便与服务器进行数据交换。数据绑定机制使得UI组件能实时反映数据变化。 6. **拖放功能**:ExtJS...

    Extjs+struts2+hibernate 做的一个简单的图书管理系统(源代码)

    在图书管理系统中,Struts2作为后端控制器,接收前端ExtJS发送的Ajax请求,处理业务逻辑,并将结果返回给前端。Struts2的动作(Action)类与Hibernate进行交互,读取或更新数据库中的图书信息。同时,Struts2还提供...

    Extjs中文教程

    - GridPanel是Extjs中用于显示表格数据的组件。 - 支持分页、排序、过滤等多种功能。 - **列模型与数据** - 列模型定义了表格的列结构,包括列名、宽度、对齐方式等。 - 数据通常通过Store加载到表格中。 - **...

    ExtJs中文教程

    3. **数据读取器(DataReader)** - 将原始数据转换为ExtJs可以使用的格式。 4. **数据存储(Store)** - 存储和管理数据的对象。 5. **ComboBox组件** - 下拉列表框组件,结合数据存储实现动态填充。 #### 十一、...

    ExtJs5+Spring.Net+MVC项目搭建笔记2

    例如,可以创建一个GridPanel显示数据,或者使用FormPanel处理用户输入。记得设置正确的Store来连接后端服务。 6. **后端API设计**:使用ASP.NET MVC的控制器和动作方法创建RESTful API,以供前端调用。这些API应与...

    Hibernate+Spring+Struts2+ExtJS开发CRUD功能.doc

    5. **ExtJS前端展示:** 利用ExtJS的GridPanel、FormPanel等组件,结合AJAX技术,实现数据的动态加载和更新。 #### 四、总结 通过上述技术栈的集成,可以构建出一个功能完善、易于扩展的企业级应用系统。其中,...

    ext-2.3.0jar包

    EXTJS的数据显示通常与服务器端的数据交换有关。2.3.0版本中,`Ext.data.Store`用于存储数据,它可以连接到各种数据源,如JSON、XML或Ajax请求。`Ext.data.Proxy`是数据获取的抽象层,提供了数据读取和写入的接口。...

    Ext开发指南

    6. **Ajax和数据通信**:了解如何使用ExtJS的Ajax功能进行异步通信,包括使用Proxy和Reader/Writer进行JSON或XML数据的读写。 7. **图表和图形**:ExtJS提供了一系列图表组件,如柱状图、饼图和线图,可用于数据...

    Ext表格控件和树控件

    数据存储器 `Store` 是 `GridPanel` 的核心组件之一,它负责管理数据集,并为数据提供检索、排序、过滤等操作。在上面的例子中,`SimpleStore` 是一个最简单的数据存储器,用于存储静态数据。 ##### 3.3 DataReader...

Global site tag (gtag.js) - Google Analytics