`

Ext.data专题三:Ext.data.Record

阅读更多

Ext.data.Record就是一个设定了内部数据类型的对象,它是Ext.data.Store的最基本组成部分。如果把Ext.data.Store看作是一张二维表,那么它的每一行就对应一个Ext.data. Record实例。

Ext.data.Record的主要功能是保存数据,并且在内部数据发生改变时记录修改的状态,它还可以保留修改之前的原始值。

我们使用Ext.data.Record时通常都是由create()函数开始,首先用create()函数创建一个自定义的Record类型,如下面的代码所示。

 

var PersonRecord = Ext.data.Record.create([

    {name: 'name', type: 'string'},

    {name: 'sex', type: 'int'}

]);

 

PersonRecord就是我们定义的新类型,包含字符串类型的name和整数类型的sex两个属性,然后我们使用new关键字创建PersonRecord的实例,如下面的代码所示。

 

var boy = new PersonRecord({

    name: 'boy',

    sex: 0

});

 

创建对象时,可以直接通过构造方法为对象赋予初始值,将'boy'赋值给name,0赋值给sex。

现在,我们得到了PersonRecord的实例boy,如何才能得到它的属性呢?以下三种方式都可以获得boy中name属性的数据,如下面的代码所示。

 

alert(boy.data.name);

alert(boy.data['name']);

alert(boy.get('name'));

 

这里涉及Ext.data.Record的data属性,这是定义在Ext.data.Record中的一个公共属性,用于保存当前record对象的所有数据。它是一个JSON对象,可以直接从它里面获得需要的数据。可以通过Ext.data.Record的get()函数方便地从data属性中获得指定的属性值。

如果我们需要修改boy中的数据,请不要使用以下方式直接操作data,如下面的代码所示。

 

    boy.data.name = 'boy name';

    boy.data['name'] = 'boy name';

而应该使用set()函数,如下面的代码所示。

 

    boy.set('name', 'body name');

 

set()函数会判断属性值是否发生了改变,如果改变了,就要将当前对象的dirty属性设置为true,并将修改之前的原始值放入modified对象中,供其他函数使用。如果直接操作data中的值,record就无法记录属性数据的修改情况。

Record的属性数据被修改后,我们可以执行如下几种操作。

q   commit()(提交):这个函数的效果是设置dirty为false,并删除modified中保存的原始数据。

q   reject()(撤销):这个函数的效果是将data中已经修改了的属性值都恢复成modified中保存的原始数据,然后设置dirty为false,并删除保存原始数据的modified对象。

q   getChanges()获得修改的部分:这个函数会把data中经过修改的属性和数据放在一个JSON对象里并返回。例如上例中,getChanges()返回的结果是{name:’body name’}。

q   我们还可以调用isModified()判断当前record中的数据是否被修改。

      Ext.data.Record还提供了用于复制record实例的函数copy()。

 

var copyBoy = boy.copy();

 

这样我们就得到了boy的一个副本,它里面包含了boy的data数据,但copy()函数不会复制dirty和modified等额外的属性值。

分享到:
评论

相关推荐

    Ext.data.Store的基本用法

    console.log(record.get('name')); } ``` #### 七、总结 本文详细介绍了`Ext.data.Store`的基本用法,包括创建实例、数据转换、排序操作以及如何从`store`中获取数据。通过掌握这些基本知识,开发者可以更加灵活...

    Ext.data.Store 读取XML属性值

    这篇博客文章《Ext.data.Store 读取XML属性值》可能深入探讨了如何利用`Ext.data.reader.Xml`来解析XML并填充数据存储。 XML是一种结构化数据格式,广泛用于数据交换,尤其是Web服务和API。`Ext.data.reader.Xml`是...

    Ext.DataView 图片列表显示

    var reader = new Ext.data.JsonReader({totalProperty:'totalProperty',root:'root'},record); store = new Ext.data.Store({ proxy:proxy, reader:reader }); //尾 分页 var pagebar = new Ext....

    EXT核心API详解.doc

    23. **Ext.data.Record类**:数据记录模型,用于存储和操作数据。 24. **Ext.data.DataProxy类**:数据代理,抽象了数据源,包括HttpProxy、MemoryProxy等。 25. **Ext.data.HttpProxy类**:HTTP数据代理,通过...

    Ext.ux.UploadDialog

    Most configuration options are inherited from Ext.Window (see ExtJs docs). The added ones are: url - the url where to post uploaded files. base_params - additional post params (default to {}). ...

    根据输入的关键字过滤ext树节点

    return record.get('text').indexOf(keyword) !== -1; // 根据文本内容过滤 } }); ``` 5. **动画效果**:为了让过滤过程更直观,可以启用动画效果。在树面板配置中加入`animate: true`,使得节点在展开和折叠时有...

    EXT核心API详解

    25、Ext.Ajax类 ………………………… 22 26、Ext.data.Record类 ………………… 23 27、Ext.data.DataProxy类 …………… 24 28、Ext.data.HttpProxy类 …………… 24 29、Ext.data.MemoryProxy类 ……… 25 30、...

    Ext.grid.GridPanel属性祥解

    #### 三、Ext.grid.GridPanel主要方法 1. **getColumnModel()** - 说明:获取当前表格的列模型。 2. **getSelectionModel()** - 说明:获取当前表格的选择模式。 3. **getStore()** - 说明:获取当前表格的数据...

    Ext 中的Tree实现不同节点不同的右键菜单

    if (record.data.type === 'folder') { // 如果是文件夹节点 menu = Ext.create('Ext.menu.Menu', { items: [{ text: '打开', handler: function() { console.log('打开文件夹:', record.data.text); } }, {...

    EXT中文开发手册

    中文API文档 数据存储与传输 Ext.data简介 Ext.data.Connection Ext.data.Record Ext.data.Store 基本应用 对数据进行排序 从store中获取数据 更新store中的数据

    ExtJS入门教程(超级详细)

    25、Ext.Ajax类 ………………………… 22 26、Ext.data.Record类 ………………… 23 27、Ext.data.DataProxy类 …………… 24 28、Ext.data.HttpProxy类 …………… 24 29、Ext.data.MemoryProxy类 ……… 25 30、...

    ExtJs选中var editor = new Ext.ux.grid.RowEditor详解

    data: Ext.encode(record.data), // 将数据编码成字符串形式 id: record.id }, success: function() { alert(10); } }); grid.getView().refresh(); // 刷新视图 }); ``` - `store` 是 `GridPanel` 绑定...

    ext 基本知识-store-proxy-reader-ext-connection-实例

    三、Ext.data.StoreExt.data.Store是ExtJS中用于管理数据集的核心组件,它可以加载并存储数据,同时提供对数据的查询、排序、过滤等功能。在描述中的`var ds = Ext.data.JsonStore({url: 'xxx.jsp',root: 'root',...

    ExtJS 制作个性表格

    var myStore = Ext.create('Ext.data.Store', { model: 'MyModel', proxy: { type: 'ajax', url: 'data.json', reader: { type: 'json', rootProperty: 'rows' } } }); myStore.load(); ``` 5. **...

    ext核心api详解(3)

    在EXTJS应用中,`Ext.data.Connection`和`Ext.Ajax`用于与服务器进行数据交互,而`Ext.data.Record`则作为数据操作的基础单元。这些API的熟练掌握对于构建复杂的EXTJS应用程序至关重要,它们提供了丰富的功能,包括...

    ExtJs grid多选时获取选中的所有值

    console.log('Username:', record.get('userName')); console.log('Email:', record.get('email')); console.log('Status:', record.get('status')); }); } else { console.log('没有选中任何记录'); } } //...

Global site tag (gtag.js) - Google Analytics