EXT中所有和数据相关的类都放在Ext.data命名空间下。
* Store: 最主要的对外交互接口,内部保存了一个数据集。
JsonStore
JsonReader 把代理读取的数据读入数据集。
* Record: 数据集里面的每一条记录。
* DataField: 定义了记录每个字段的schema。
* DataProxy: 获取数据的代理。
ScriptTagProxy
HttpProxy,
* DataReader: 把代理读取的数据读入数据集。
Store的实现
内部用一个Ext.util.MixedCollection(既能够作为map进行索引,又能够作为list进行索引,并且更新数据时会触发事件,并且有一些其它功能的数据结构)作为数据集存放record。store实例的data域指向这个数据集。
通过proxy加载不同来源的数据,如http remote,memory data等等。
由于proxy加载过来的数据是异构的,所以通过不同DataReader的实现类来读入数据成为record。
当调用load方法时候,就会委托proxy去加载数据。
在data数据集中数据的数据,添加,修改,删除的时候触发事件。
Store数据加载流程简介
(1)实例化一个Proxy的实现proxy。
(2)实例化一个DataReader的实现reader。
(3)实例化一个Store对象store。设置store的proxy与reader。
(4)监听store的load事件或者datachange事件。
(5)调用store.load()
(6)store.load会调用proxy的load方法来加载数据(各种DataSource)。并且把reader作为参数传入。
(7)proxy的load方法加载完数据之后,调用传入的reader的read方法,并且把数据作为参数传入。
(8)reader的read方法把异构数据读入成record数据集。
(9)proxy把reader.read方法生成的record数据集作为参数,回调store。
(10)store把数据集添加到或者替换原来的数据集。
(11)触发load事件,触发datachange事件
转自
http://canfly2010.iteye.com/blog/408930
分享到:
相关推荐
三、Ext.data.StoreExt.data.Store是ExtJS中用于管理数据集的核心组件,它可以加载并存储数据,同时提供对数据的查询、排序、过滤等功能。在描述中的`var ds = Ext.data.JsonStore({url: 'xxx.jsp',root: 'root',...
Ext数据模型中的Store是EXT框架中非常核心的一个概念,它是数据管理的主要接口,负责存储和管理数据集。Store内部使用了`Ext.util.MixedCollection`数据结构,这使得它可以同时作为映射和列表来操作数据,并在数据...
通过以上步骤,开发者不仅能够掌握 Ext JS 的基础安装与配置流程,还能学会如何利用 Grid 控件快速搭建数据展示界面,从而迈出 Ext JS 技术栈的第一步。随着实践的深入,相信你将能挖掘出更多 Ext JS 的高级特性和...
以上代码示例展示了如何在Ext JS中创建级联下拉框的基本流程。在实际应用中,可能还需要考虑其他因素,比如错误处理、数据分页、异步加载等。理解并掌握这些知识点对于构建高效、响应式的Web应用至关重要。
总的来说,“ExtProject”是一个全面介绍Ext数据库操作和Ajax请求的实践项目,它将帮助初学者快速掌握Ext框架的核心功能,并了解前后端数据交互的基本流程。通过这个项目,你不仅可以学习到Ext的使用,还能进一步...
- Grid可以与数据源(如Store)绑定,动态加载和更新数据。 - 提供多种内置功能,如行编辑、行选择、行拖放等。 2. 封装的意义: - 代码封装是软件工程中的基本原则,它将复杂性隐藏在内部,对外提供简洁的接口...
7.5.4 ext.data.store加载数据的方法 / 350 7.5.5 ext.data.treestore加载数据的方法 / 354 7.5.6 store的配置项 / 358 7.5.7 store的分页 / 359 7.5.8 store的排序:ext.util.sorter与ext.util.sortable / 360...
- **模型层**:负责管理数据模型,包括任务模型和依赖模型,使用`Ext.ux.maximgb.tg.AdjacencyListStore`和`Ext.data.Store`类进行数据管理和操作。 - **界面显示组件**:`GanttPanel`类是主要的可视组件,用于显示...
4. **Form处理**:EXT的表单组件支持复杂的数据输入和验证,EXT4.1增加了更多的表单元素和布局选项,如字段集、组合框、日期选择器等,同时也优化了表单的提交和处理流程。 5. **AJAX通信**:EXT4.1改进了Ajax请求...
EXT桌面系统2.0的开发过程中,可能涉及到的技术还包括:JSONP或CORS用于跨域数据请求,Less或Sass进行CSS预处理器的使用以提高样式管理效率,以及可能采用的任务调度工具如Grunt或Gulp来自动化构建流程。此外,为了...
通过模型(Models)、store(数据存储)和代理(Proxies),EXT JS实现了数据的加载、保存和展示,极大地简化了数据操作。 EXT JS还支持Ajax和JSONP,便于与服务器进行异步通信。同时,EXT JS具有良好的可扩展性,...
EXT JS的分页通常通过Store组件来实现,Store负责加载和管理数据,并与Grid进行绑定。分页配置包括页面大小(pageSize)、总计记录数(totalProperty)以及数据源(proxy),通常使用HTTP代理(Ext.data.HttpProxy)...
最后,将XML数据源绑定到store,数据加载完成后,表格会自动填充这些数据。部署到TOMCAT或其他WEB容器是为了运行后端服务,提供XML数据,实现前后端分离的架构。 在实际应用中,我们可能还需要处理分页、过滤、行...
开发者可能需要解压这个文件夹,然后在本地服务器环境中运行这些文件,以便浏览器可以正确加载和执行JavaScript。 下面,我们将详细讨论ExtJS的关键知识点: 1. **组件模型**:ExtJS的核心是其组件模型,它允许...
当Store加载数据时,会通过Proxy获取数据,然后由Reader将数据转化为Record。在数据集发生变化时,如添加、修改或删除,都会触发相应的事件。 数据加载流程一般如下: 1. 创建Proxy实例。 2. 创建DataReader实例。 ...
以上就是利用Ext4.1.1a的GridPanel导出数据到Excel的基本流程。实际应用中,可能还需要考虑其他因素,比如数据过滤、排序状态的保持,以及用户界面的反馈等。对于大型数据集,可能还需要优化性能,避免一次性加载...
**集成流程** 1. **引入依赖**:首先,你需要确保已经安装了包含图表支持的ExtJS库。这通常涉及到在HTML文件中引入相关的CSS和JavaScript文件,或者通过模块化工具(如Webpack或RequireJS)来加载。 2. **创建图表...
一旦Store加载了数据,只需将Store绑定到Chart,图表就会自动更新以反映数据的变化。 在创建具体图表类型时,你需要定义不同的系列(series)。例如,如果你想要创建一个柱状图,可以在Chart的配置中添加一个`type:...
3. 创建TreePanel:这是EXT3.0中显示树的容器,需要配置store(数据源)、root(根节点)和其它属性。 4. 配置TreeStore:将数据源与TreePanel关联,设置加载方法和数据格式。 5. 渲染Tree:在页面上添加TreePanel...
书中会讲解如何使用Store来管理数据,以及如何通过Model定义数据结构,最后通过Data Binding实现视图的实时更新。 **3. MVC架构** Ext JS 6 遵循MVC(Model-View-Controller)设计模式,有助于组织代码并提高可...