Extjs中创建或得到Record和Store的几种方法

posted by David Chen at April 15, 2008, 1:00 AM

以下是我结的几种取得record和store的方法：
1) // create 最基本建立Record和Store的方法
var myStore = new Ext.data.Store();
var TopicRecord = Ext.data.Record.create([
        {name: 'title', mapping: 'topic_title'},
        {name: 'author', mapping: 'username'},
        {name: 'totalPosts', mapping: 'topic_replies', type: 'int'},
        {name: 'lastPost', mapping: 'post_time', type: 'date'},
        {name: 'lastPoster', mapping: 'user2'},
        {name: 'excerpt', mapping: 'post_text'}
]); // 列表影射,columnModel
var myNewRecord = new TopicRecord({
        title: 'Do my job please',
        author: 'noobie',
        totalPosts: 1,
        lastPost: new Date(),
        lastPoster: 'Animal',
        excerpt: 'No way dude!'
}); // 实际的一条记录
myStore.add(myNewRecord);

2) // 这种方法也可以构建一个store
var store = new Ext.data.SimpleStore({
        fields: ['abbr', 'state', 'nick'], 
        // 一定要有这个,如果放在grid中，与column的dataIndex属性值对应
        data : [
        ['AL', 'Alabama', 'The Heart of Dixie'],
        ['AK', 'Alaska', 'The Land of the Midnight Sun'],
        ['IN', 'Indiana', 'The Hospitality State']
        ]
});

3) 还有一个种方法,用ArrayReader,数据源是js二维数组,用SimpleStore
var store = new Ext.data.SimpleStore({
        /*
        数据源：[ [1, 'AL', '0.1', 'The Heart of Dixie', '6', new Date()] ]
        ArrayReader中, ajax会返回一个数据源给ArrayReader,
                fields数组与数据源的序列的顺序要相同
        */
        fields: ['pid', 'company', 'price', 'change', 'pctChange', 'lastChange'],
        url: 't2.php',
        reader: new Ext.data.ArrayReader(
                {id: 0},
                /*
                id 的取值应为下面的mapping的值,如果在下面没有出现,则取数据源的0序列
                ,recordid可通过store.getById(recordid) 取得相应的 Record
                当有 id 这个属性设置的时候,如果id值为2,就表示用price作recordid
                , 如果 name 的值与数据源的序列的名称相同，就可以不指定mapping
                */
                [{name:'company',mapping: 1}, {name:'price',mapping: 2},
                 {name:'change',mapping: 3}, {name:'pctChange',mapping: 4},
                 {name:'lastChange',mapping: 5}]
                )
});
// 因为使用url会触发ajax, 是异步方式，如果是要ajax读取数据后马上触发事件，
// 必须添加load事件的监听
store.addListener('load', function(st, rds, opts) {
        // st 是当前的store, rds是读到的Record[], opts是store的配置
        //alert(rds.getTotalCount());
        nextstore.removeAll(); //先清除另一个store的内容
        nextstore.add(rds); // 给另一个store添加这些records
        //for( var c=0; c<rds.length; c++ ) store.addSorted(rds[c]);
});
store.load();

4) 还有一个种方法,用XmlReader,数据源是xml, 只能用Ext.data.Store,不能用SimpleStore
就因为SimpleStore,害我搞了n久才发现只能用Store
先看数据源：
<?xml?>
<dataset>
 <results>2</results>
 <row>
   <id>1</id>
   <name>Bill</name>
   <occupation>Gardener</occupation>
 </row>
 <row>
   <id>2</id>
   <name>Ben</name>
   <occupation>Horticulturalist</occupation>
 </row>
</dataset>
js:
var store = new Ext.data.Store({
        fields: ['id', 'name', 'occupation'],
        url: 't2.php',
        reader: new Ext.data.XmlReader(
                {
                record: "row", // xml中每行数据的内容
                totalRecords: "results", // xml中的results节点,表时记录数 (option)
                id: 'id'
                // 每行数据的素引,xml中是row标签的子节点, 作recordid, (option), 
                // 如果id列在数据源中的值有重复，就只会显前面的列，后面的放弃.
                },
                /*
                id 的取值应为下面的mapping的值,如果在下面没有出现,则取数据源的0序列
                当有 id 这个属性设置的时候,如果id值为2,就表示用price作recordid
                下面的mapping,是定义的素引与xml中的节点对应
                , 如果 name 的值与数据源的序列的名称相同，就可以不指定mapping
                */
                [{name:'name',mapping: 'name'}, {name:'occupation'} ]
                // 这里也可写成 ['id', 'name', 'occupation']
        )
});
// 因为使用url会触发ajax, 是异步方式，如果是要ajax读取数据后马上触发事件，
// 必须添加load事件的监听
store.addListener('load', function(st, rds, opts) {
        // st 是当前的store, rds是读到的Record[], opts是store的配置
        //alert(rds.getTotalCount());
        nextstore.removeAll(); //先清除另一个store的内容
        nextstore.add(rds); // 给另一个store添加这些records
        //for( var c=0; c<rds.length; c++ ) store.addSorted(rds[c]);
});
store.load();