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
})
);
Extjs定时操作的更多相关文章
- C# 创建Windows服务。服务功能:定时操作数据库 (转)
C# 创建Windows服务.服务功能:定时操作数据库 一.创建window服务 1.新建项目-->选择Windows服务.默认生成文件包括Program.cs,Service1.cs 2.在S ...
- extjs gridpanel 操作行 得到选中行
extjs gridpanel 操作行 得到选中行的列 在Extjs 3.2.0上适合 var model = grid.getSelectionModel(); model.selectAll(); ...
- ExtJS定时和JS定时
ExtJS定时 //定时刷新待办事宜状态 var task={ run:function(){ //执行的方法或方法体 }, interval:5*60*1000 //5分钟 } //定时启动 Ext ...
- Extjs DOM操作的几个类
Extjs提供了非常完善的DOM操作方法,可以方便的操作DOM.另外Extjs还可以方便的查询DOM元素,并把这些DOM元素封装成Ext.Element对象,通过Element对象我们可以操作DOM元 ...
- 执行Sqlserver中waitfor delay延时操作或waitfor time定时操作
private static string connectionString = RBAC.Dal.DataRootBase.ConnectionString; private SqlConnecti ...
- Spring 定时操作业务需求
1.定时分析 在业务需求中有的需要检测用户的状态,通过对用户状态的检测做出对此状态相应的操作,如果这种检测由运营人工检测,不仅工作量大,而且准确性不高,人工无法很好的完成工作: 问题根源:在检测用户状 ...
- shell脚本定时操作数据库
一.数据库脚本(mysql.sh) Linux环境下,定时将数据库A的表格复制到数据库B中 #!/bin/bash mysql_host="127.0.0.1" mysql_use ...
- 关于linux定时操作cron的理解
cron是服务名称,crond是后台进程(有的后台也叫作cron,本人是ubuntu12.04,32bit),crontab则是定制好的计划任务表. 软件包安装: 要使用cron服务,先要安装vixi ...
- djang-异步——定时操作
django本身是一个同步框架,flask也是,所以要把它变成异步操作的话还得专门设置一下 我的这个系统呢是windows系统,python3.7的 所以有的库是不可以兼容的 ,然后到时候会稍微修改一 ...
随机推荐
- ionic开发android App
在win下配置ionic可以参考七月的这篇博客:http://www.cnblogs.com/shikelong/p/4480975.html. 依照七月的思路基本可以创建一个ionic项目了,下面我 ...
- SQLyog普通版与SQLyog企业版对比分析
这里,为什么要写这篇博客呢? 对于SQLyog普通版而言,只能复制到不同的数据库里,这样显得麻烦,当然,你也可以用语句来操作达到实现目的. 具体做法: MySQL复制旧表的结构及数据到新表 CREAT ...
- Potentiometers
题意: 线段树的单点修改,区间查询 #include <map> #include <set> #include <list> #include <cmath ...
- Wedding(2-SAT)
传送门 稍微复杂一点的2-SAT. 读题之后发现有以下限制: 1.每一对夫妻(包括新郎和新娘)不能坐在桌子的一侧. 2.对于一些给定的非法(自行脑补)的关系,这两个人不能坐在新娘的同一侧. 因为每个人 ...
- POJ1704 Georgia and Bob Nim游戏
POJ1704 这道题可以转化为经典的Nim游戏来解决. Nim游戏是这样的 有n堆石子,每堆各有ai个. 两个人轮流在任意石子堆中取至少1个石子,不能再取的输. 解决方法如下, 对N堆石子求异或 为 ...
- js原始数据类型和引用数据类型=>callback数据传输原理
摘要:js的数据类型有种划分方式为 原始数据类型和 引用数据类型. 原始数据类型 存储在栈(stack)中的简单数据段,也就是说,它们的值直接存储在变量访问的位置.栈区包括了 变量的标识符和变量的值. ...
- deepin 安装maven
1.在官网 http://maven.apache.org/download.cgi 下载mvn包 2.新建mvn目录 mkdir /usr/local/mvn 把压缩包解压到mvn目录下面 修 ...
- c语言小项目-使用mysql数据库的图书管理系统
VS2013通过MySQL方式连接到MySQL MySQL官网上C++的API有两个.一个是很成熟的mysql++,另一个是MySQL Connector/C++,近两年才出的,模仿JDBC做的,封装 ...
- 多维DP UVA 11552 Fewest Flop
题目传送门 /* 题意:将子符串分成k组,每组的字符顺序任意,问改变后的字符串最少有多少块 三维DP:可以知道,每一组的最少块是确定的,问题就在于组与组之间可能会合并块,总块数会-1. dp[i][j ...
- ACM_闹钟人生(水题)
闹钟人生 Time Limit: 2000/1000ms (Java/Others) Problem Description: 已知一个时钟一开始指向0点,顺时针走了n个小时,求它最终所指向的数字(时 ...