Extjs定时操作

查看api可知：

// 启动一个简单的时钟任务，每秒执行一次更新一个

div var task = {

  run: function(){
      Ext.fly('clock').update(new Date().format('g:i:s A'));
  },
  interval: 1000 //1秒

}

Ext.TaskManager.start(task);

 1，Extjs如何隔一段时间操作一次

可以看出task是一个 var，通过设置interval隔一段时间操作一次

2，实现的功能效果图：

view层代码：

 Ext.define('ExtApp.view.StudentMonitor' , {
     extend : 'Ext.grid.Panel' ,
     id : 'StudentMonitorGrid' ,
     xtype : 'StudentMonitor' ,
     store : 'StudentMonitor' ,
     draggable:false, //设置为false则禁用拖拽改变列顺序、
     columnLines:true,//添加列的框线样式
     viewConfig: {
         stripeRows:true //True来实现隔行换颜色
     },
     tbar : [{
         xtype : 'form',
         width : '100%',
         id : 'FormMonitor',
         items : [{
             xtype : 'container',
             padding : 5,
             flex : 2,
             layout : {
                 type : 'hbox'
             },
             items : [{
                 xtype : 'button',
                 id : 'btnOnMonitor',
                 text : '打开学生监控'
             },{
                 xtype : 'button',
                 id : 'btnOffMonitor',
                 text : '关闭学生监控'
             },{
                 padding:5,
                 xtype:'container',
                 flex:1,
                 anchor:'100%',
                 layout:{
                     type:'hbox',
                     pack:'end'
                 },
                 items:[{
                     xtype:'button',
                     id:'btnEmptyMonitor',
                     text:'全部清空'
                 }]
             }]
         }]
     }],
     columns : [
         //{xtype:'rownumberer',text:'序号',flex:1,    align:'center'},
         {text:'账户ID' , flex:1 , align:'center' , dataIndex:'userCode'},
         {text:'用户姓名' , flex:1 , align:'center' , dataIndex:'userName'},
         {text:'年级' , flex:1 , align:'center' , dataIndex:'gradeName'},
         {text:'时间' , flex:2 , align:'center' , dataIndex:'time'    },
         {header: "测试记录", align:"center",flex:2,
             renderer:function(value){
                    return '<font size="3" color="red">该同学已经5分钟没有操作屏幕</font>';
                }
         },
         {xtype: 'actioncolumn' , //这里是放按钮的地方
          header: '操作' ,
          width: 50 ,
          flex : 1 ,
          align:'center',
          items: [{
              icon : 'images/user_delete.png'  ,   //删除图标
             tooltip : '删除账户' ,
             handler : function(grid, rowIndex, colIndex){
                 console.log(rowIndex);
                 var store = grid.getStore();
                 console.log(store.getAt(rowIndex));
                 store.removeAt(rowIndex);
                 grid.updateLayout();
            }
         }]
     }],
     dockedItems:[{
         xtype: 'pagingtoolbar',
         store : 'StudentMonitor' ,   // GridPanel中使用的数据
            dock: 'bottom',
           displayInfo: true
     }]

 });

controller层代码：

 onMonitor:function(btn,event){
         var grid=Ext.getCmp('StudentMonitorGrid');
         var store=this.getStore('StudentMonitor');
         var pageBar = grid.down('pagingtoolbar');
         pageBar.moveFirst();
         task={
             run:function(){
                 Ext.Ajax.request({
                     url: 'getMessages.action',
                     callback:function(options,success,response){
                         console.log(response);
                         console.log(response.responseText);
                         console.log(Ext.decode(response.responseText));
                         console.log(Ext.decode(response.responseText).rows);
                         var data = Ext.decode(response.responseText).rows;
                         for(var i in data){
                             console.log(data[i]);
                             store.add({
                                 userCode:data[i].userCode,
                                 userName:data[i].userName,
                                 time:data[i].time,
                                 gradeName:data[i].gradeName
                             })
                         }
                     }
                 })
             },
             interval:1000
         };
         Ext.TaskManager.start(task);
        } ,
32　　var task;

3，如何删除store为本地grid的一行？

通过grid带的函数handler可以找到rowIndex，通过Store.removeAt(rowIndex);

Store操作返回后台时候：

通过Ext.Ajax.request执行即可

4，Extjs中decode使用

通过把response打印出来，可以看出我们需要的是responseText,由于返回的是一个Jason格式字符串
我们需要使用decode，可以看api:decode( String json, Boolean safe ) : Object，,传入是一个Jason,出来是个object
通过打印 console.log(Ext.decode(response.responseText)); 我们发现，返回了"rows"和"results"，我们取得rows，返回的是是一个数组，通过 for(var i in data)取到数组里面的值

为啥不decode就不行？

只有返回的是Object才可以通过 .取值

例如：

5，extjs怎样在gird中添加一行？
store.add()
参考资料：http://blog.csdn.net/itlwc/article/details/7868626

var record = store.getAt(index);

store.add(

　　new MyRecord({

name : 'lwc',

age : 18

})

);