ExtJs4用Ext.data.ArrayStore的使用实例

ExtJs4用Ext.data.ArrayStore的使用实例

2013-07-04 09:54:43   来源：   评论：0 点击：3135

Ext.data.ArrayStore可以用来装载本地数组数据

Ext.onReady( function (){
    var list_reader1= "list_reader1" ;
    Ext.define( 'list_reader1' ,{
        extend: 'Ext.data.Model' ,
        fields: [
            {name: 'id' },
            {name: 'title' },
            {name: 'description'
 }
        ]
    });

var dataArray = [[ '1' , "spring in Action" ,  '' ]
       , [ '2' , "ajax高级实战" , '' ]];

var store = Ext.create( "Ext.data.ArrayStore" , {
      model: list_reader1,
      data: dataArray
 });
store.load();
    // create the grid
    var grid = Ext.create( 'Ext.grid.Panel' , {
        store: store,
        columns: [
            {text: "作者" , width: 120, dataIndex: 'id' , sortable: true },
            {text: "标题" , flex: 1, dataIndex: 'title' , sortable: true },
            {text: "描述" , width: 125, dataIndex: 'description' , sortable: true }
        ],
        forceFit: true ,
        height:210,
        split: true ,
        region: 'north'
    });


    Ext.create( 'Ext.Panel' , {
        renderTo: 'binding-example' ,
        frame: true ,
        title: 'grid示例' ,
        width: 580,
        height: 400,
        layout: 'border' ,
        items: [grid ]
    });

});
//当然我们也可以不适用model，而直接在store里面定以fields，如下所示
var store = new Ext.data.Store({
      fields: [
      { name: "id" , type: "int" },
      {
        name: 'title' , type: "string"
      }, {
        name: 'description'
     }],
       //这个是用来代替model，在这里定义了这个fields之后，
       //就会自动创建一个匿名的model来使用的
      data: dataArray,
      autoLoad: true
  });

分享到：            收藏

相关热词搜索： Ext.data.ArrayStore ExtJs4 使用实例