EXT Tabpanel多标签实时监控中ajax请求的关闭控制解决办法

问题背景:利用Tabpanel来完成项目中实时监控任务的展现,ajax定时(隔10秒或5秒)后台请求
数据。因此脚本要管理到每一个tabpanel与ajax请求的新增与关闭。
处理思路:用时间戳区分每一个产生的tab,每新增一个tab,则产生一个新的ajax请求对象,将
新产生的tab与ajax都保存进入一个简单的数组或类哈希表的结构中。监听tab的关闭
动作,消除对应的ajax请求对象和tab对象。
关键代码:

//存储实时监控任务数据请求的对象
var relTimeTaskHashMap = {
Set : function(key, value) {
this[key] = value
},
Get : function(key) {
return this[key]
},
Contains : function(key) {
return this.Get(key) == null ? false : true
},
Remove : function(key) {
delete this[key]
}
};
//存储tab对象
var chartHashMap = {
Set : function(key, value) {
this[key] = value
},
Get : function(key) {
return this[key]
},
Contains : function(key) {
return this.Get(key) == null ? false : true
},
Remove : function(key) {
delete this[key]
}
};
//ajax请求的守护对象,负责ajax请求发起和停止
function RealTimeTaskDefend(){
var threadStatus;
var callBackFunction;
this.setCallBackFunction=function(callFunction){
this.callBackFunction=callFunction;
}
this.run=function(){
this.threadStatus=setInterval(this.callBackFunction,5000);
}
this.stop=function(){
clearTimeout(this.threadStatus);
}
}
//新增加一个tab需要完成的动作
var realTimeTaskDefend = new RealTimeTaskDefend();
relTimeTaskHashMap.Set(tabPanelId, realTimeTaskDefend);
chartHashMap.Set(tabPanelId,'实时监控的展现对象入口');

//发起监控请求需要完成的动作
var realTimeTaskDefend_run = relTimeTaskHashMap.Get(tabpanelId)
realTimeTaskDefend_run.setCallBackFunction('实时监控的数据处理方法入口');
realTimeTaskDefend_run.run();

//结束监控请求需要完成的动作
var realTimeTaskDefend_stop = relTimeTaskHashMap.Get(tabPanelId);
realTimeTaskDefend_stop .stop();
relTimeTaskHashMap.Remove(tabPanelId);
chartHashMap.Remove(tabPanelId);
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
1.帮助: TabPanel(选项卡组件) 参数说明 renderTo 渲染到某容器 将选项卡组件渲染到某容器,参数类型可以为字符串,也可以为jQuery所加载的对象,如果为声明该参数,组件默认的承载容器为BODY。 items 选项卡元素集合 选项卡组件渲染后就会显示的选项卡元素集合,具体参数请查看选项卡元素。 width 宽度 选项卡组件的总宽度,默认400px。 height 高度 选项卡组件页面显示层的高度,默认300px。 border 是否显示边框 嵌套显示选项卡时,会出现重复边框的情况,影响美观,将border设置为”none”,则可以避免,默认显示边框,不接受除”none”之外的参数值。 active 渲染后默认激活哪个选项卡元素 下标以0为开始,默认为0。 maxLength 最多显示几个选项卡元素 -1为无限,默认为-1。 tabs 获得选项卡组件所有的选项卡元素 可根据需要获得选项卡组件的所有选项卡元素。 公共方法 addTab(object) 添加一个选项卡元素 动态向选项卡组件添加一个选项卡元素。 flush(string | number) 刷新选项卡元素的内容 将选项卡元素的内容刷新,参数可以为选项卡元素的ID或下标。 show(string | number) 显示选项卡元素 显示制定选项卡元素,参数可以为选项卡元素的ID或下标。 Kill(string | number) 关闭选项卡元素 关闭选项卡元素,参数可以为选项卡元素的ID或下标。 getTabsCount() 获得选项卡元素数量 getTitle(string | number) 获得选项卡元素的标题 setTitle(string | number, string) 设置选项卡元素的标题 getContent(string | number) 获得选项卡元素的内容 setContent(string | number, string) 设置选项卡元素的内容 getDisable(string | number) 选项卡元素是否禁用 setDisable(string | number) 设置选项卡元素是否禁用 getCloseable(string | number) 选项卡元素是否可关闭 setCloseable(string | number, boolean) 设置选项卡元素是否可关闭 getActiveTab() 获得被激活的选项卡元素 使用方法 页面引入jQuery.js、TabPanel.js、Fader.js、TabPanel.css new TabPanel({ renderTo:'tabs', width: '100%', height: '500px', active: 0, items: [{ title:'工作心', html:'', closable: false }] }); TabPanel item(选项卡元素) 参数说明 id 元素ID 必须唯一,或者不设置该参数,否则将无法添加到选项卡组件,默认自动生成。 title 元素标题 可以动态设置。 closeable 是否可关闭 true可关闭,false不可关闭,默认为true。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值