Extjs 4 单条刷新数据（单行操作）定时器监听 getAt();.getSelectionModel().select(flag);

先上一张效果图：

效果描述：点击【开始监测】，能够选定某行数据，然后通过ajax到后台单行刷新数据，一行一行逐条刷新。

技术重点：

1、定时器

这里的参数flag是用来标识到第几行的，int型。grid是我的表格id

//执行定时器的变量
var runner = new Ext.util.TaskRunner();
var task;
//行标记
var flag = 0;

//开始监听
function listen(){
	task = runner.start({
	    run:refresh,
	    interval:1000
	});
}

//成功之后选择刷新行
Ext.getCmp('grid').getSelectionModel().select(flag);

//停止监听function stopListen(){runner.stop(task);}

2、单行选定

这里的参数flag是用来标识到第几行的，int型。grid是我的表格id

//成功之后选择刷新行
    		Ext.getCmp('grid').getSelectionModel().select(flag);

3、单行数据修改

这里看官方文档有其他方法，但是据我测试都有问题，最后还是老老实实一条条set进去，不过我不是所有数据更新，只是更新几个值，还可以接受。

var row = Ext.getCmp("grid").getStore().getAt(flag);
    var id = row.get("id");
    $.ajax({
    	url:'Im_DitchRegimen_refresh.action?id='+id,
    	dataType:'json',
    	success:function(data){
    		//成功之后选择刷新行
    		Ext.getCmp('grid').getSelectionModel().select(flag);
    		//改变背景颜色,这个方法不太好用
    		//Ext.getCmp("grid").getView().getNode(flag).style.backgroundColor='#c3daf9';
    		//装载最新的数据
    		row.set("average",data.average);
    		row.set("max",data.max);
    		row.set("min",data.min);
    		row.set("meatime",data.meatime);
    		row.commit();
    		
    		//改变flag
    		var maxColumn = Ext.getCmp("grid").getStore().getCount();
        	if(flag<maxColumn-1) flag++;
        	else flag=0;
    	}
    });

全部代码：

这里只贴了我的MVC中的view，代码不是很规范，因为我没有把监听写到Controller中。因为我的项目很小，那种很模块化的我维护起来太难了。

//定义列
var columns = [{ 							//列模式
		text:'编号',
		hidden:true,
		dataIndex: 'id',
		align:'center'
	},{
		text: '测站代码',
		width: 160,
		dataIndex: 'stcd',
		sortable: true, 				//根据该列排序,默认时间为true
		align:'center'
	},{
		text: '测量时间',
		width:150,
		dataIndex: 'meatime',
		align:'center',
		renderer:Ext.util.Format.dateRenderer('Y-d-m H:i:s')		//时间格式化
	},{
		text: '当前值',
		width:120,
		dataIndex: 'average',
		align:'center'
	},{
		text: '汛限值',
		width:160,
		dataIndex: 'max',
		align:'center'
	},{
		text: '最低值',
		width:160,
		dataIndex: 'min',
		align:'center'
	},{
		text: '总计水位',
		width:160,
		dataIndex: 'total',
		align:'center',
		hidden:true
	},{
		text: '记录类型',
		width:160,
		dataIndex: 'meatype',
		align:'center',
		hidden:true
	},{
		text: '时间类型',
		width:160,
		dataIndex: 'timetype',
		align:'center',
		hidden:true
	}];

//定义工具条
var topBar = Ext.create('Ext.toolbar.Toolbar',{
	width:500,
	items:[{
		text:'开始监测',
		xtype:'button',
		icon:'iframe/images/icon/add.png',
		handler:listen
	},"-",{
		text:'停止监测',
		xtype:'button',
		icon:'iframe/images/icon/report_edit.png',
		handler:stopListen
	}]
});

//定义view
Ext.define('Im.view.Im_DitchRegimenView', {
	//初始化
	innitComponent:function(){
		this.callParent(arguments);
	},
	extend: 'Ext.grid.Panel',			//引用控件
	title: '实时渠道水情监测',					//标题名
	frame: true, 						//面板渲染
	fit:'auto',
	store:'Im_DitchRegimenStore',
	id:"grid",
	alias:'widget.DitchRegimen',		//定义微件
	columnLines:true,				//线宽
	dockedItems:[{
    	xtype:'pagingtoolbar',
    	store:"Im_DitchRegimenStore",
    	id:"myPagingtoolbar",
    	displayInfo: true,
        displayMsg: '当前显示记录: {0} - {1} 共计: {2}',
        emptyMsg: "没有记录可以显示",
    	dock:'bottom'
    }],
    tbar:topBar,						//绑定
	selType:'checkboxmodel',			//选择模型的xtype，这里带选择checkbox
    multiSelect:true,					//多选框
    viewConfig:{forceFit:true}, 		//让grid的列自动填满grid的整个宽度，不用一列一列的设定宽度。
    autoExpandColumn:'timetype',
	columns:columns,					//附加列属性
	listeners:{
    	itemdblclick:function(t,record,item,index,event,eOpts){			//双击修改
    		myForm.getForm().loadRecord(record);
    		myForm.getForm().url = "Im_DitchRegimen_update.action";
    		win.show();
    	}
    }
});

//一条一条刷新数据
var refresh = function () {
    var row = Ext.getCmp("grid").getStore().getAt(flag);
    var id = row.get("id");
    $.ajax({
    	url:'Im_DitchRegimen_refresh.action?id='+id,
    	dataType:'json',
    	success:function(data){
    		//成功之后选择刷新行
    		Ext.getCmp('grid').getSelectionModel().select(flag);
    		//改变背景颜色,这个方法不太好用
    		//Ext.getCmp("grid").getView().getNode(flag).style.backgroundColor='#c3daf9';
    		//装载最新的数据
    		row.set("average",data.average);
    		row.set("max",data.max);
    		row.set("min",data.min);
    		row.set("meatime",data.meatime);
    		row.commit();
    		
    		//改变flag
    		var maxColumn = Ext.getCmp("grid").getStore().getCount();
        	if(flag<maxColumn-1) flag++;
        	else flag=0;
    	}
    });
}

//执行定时器的变量
var runner = new Ext.util.TaskRunner();
var task;
//行标记
var flag = 0;

//开始监听
function listen(){
	task = runner.start({
	    run:refresh,
	    interval:1000
	});
}

//停止监听
function stopListen(){
	runner.stop(task);
}