Extjs4 关于Store的一些操作(加载/回调/添加)


Posted in Javascript onApril 18, 2013

1、关于加载和回调的问题
ExtJs的Store在加载时候一般是延迟加载的,这时候Grid就会先出现一片空白,等加载完成后才出现数据;因此,我们需要给它添加一个提示信息!
但是Store却没有waitMsg属性。

解决方案
1.给store添加监听器,监听beforeload事件,加载前弹出提示框,加载完成后关闭提示框
2.callback为load的回调函数,在加载完成后执行,因此关闭提示框由它完成;
3.一定要给store的reload方法也添加callback函数,已关闭提示框
例子主要代码如下:

varmsgTip; // 一定要定义在使用前,且定义为全局变量 
var reportStore=new Ext.data.Store({ 
proxy:reportProxy, 
reader:reportReader, 
listeners:{ 
beforeload:function(){ 
msgTip = Ext.MessageBox.show({ 
title:'提示', 
width : 250, 
msg:'页面报表统计信息刷新中,请稍后......' 
}); 
} 
} 
}); 
reportStore.load({ 
callback: function(records, options, success){ 
msgTip.hide(); // 加载完成,关闭提示框 
} 
}); 
注意:如果有调用reload来重新刷新页面,reload也要添加callback函数来关闭提示框 
reportStore.reload({ 
callback: function(records, options, success){ 
msgTip.hide(); // 加载完成,关闭提示框 
} 
}); 
--------以下为其他参数------ 
store.load({ 
params:{start:0,limit:20}, //参数 
// callback是加载完毕时执行的回调函数,它包含3个参数:records参数表示获得的数据, 
// options表示执行load()时传递的参数,success表示是否加载成功。 
callback: function(records, options, success){ 
Ext.Msg.alert('info', '加载完毕'); 
}, 
scope: store, //Scope用来指定回调函数执行时的作用域 
add: false //Add为true时,load()得到的数据会添加在原来的store数据的末尾, 
//否则会先清除之前的数据,再将得到的数据添加到store中 
 
});

2、从一个store添加符合某条件记录给另一个store中
var MyDocnumStore_Load = function(store){ 
//var index = 0; 
store.each(function(record) { 
if(record.data.PlanCarNo != '' ) { //column_name 替换成你的列名, '1' 替换成你的值 
if (record.data.Docnum != _rec.get('Docnum')){ 
var _TmpStr = record.data.UseDate+'----->'+record.data.PlanCarNo; 
myDocnumStore.add({ 
'UpDocnum':record.data.Docnum 
,'DocnumDesc':_TmpStr 
,'UseDate':record.data.UseDate 
,'PlanCarNo':record.data.PlanCarNo 
}); 
} 
} 
}) 
myDocnumStore.sort('UseDate', 'ASC'); 
}; 
MyDocnumStore_Load(mystore); //载入可拼车列表;
Javascript 相关文章推荐
javascript multibox 全选
Mar 22 Javascript
javascript 表单验证常见正则
Sep 28 Javascript
利用毫秒减值计算时长的js代码
Sep 22 Javascript
js获取当月最后一天实例代码
Nov 19 Javascript
jquery选择checked在ie8普通模式下的问题
Feb 12 Javascript
一个简单的动态加载js和css的jquery代码
Sep 01 Javascript
Javascript+CSS实现影像卷帘效果思路及代码
Oct 20 Javascript
Javascript中arguments和arguments.callee的区别浅析
Apr 24 Javascript
js实现YouKu的漂亮搜索框效果
Aug 19 Javascript
简述ES6新增关键字let与var的区别
Aug 23 Javascript
js cavans实现静态滚动弹幕
May 21 Javascript
解决vant框架做H5时踩过的坑(下拉刷新、上拉加载等)
Nov 11 Javascript
JQuery 常用方法和事件详细介绍
Apr 18 #Javascript
基于JQuery 滑动与动画的说明介绍
Apr 18 #Javascript
ExtJs默认的字体大小改变的几种方法(自己整理)
Apr 18 #Javascript
基于JQuery 选择器使用说明介绍
Apr 18 #Javascript
关于jquery css的使用介绍
Apr 18 #Javascript
js字符串转换成xml对象并使用技巧解读
Apr 18 #Javascript
jQuery使用技巧简单汇总
Apr 18 #Javascript
You might like
成本8450万,票房仅2亿,口碑两极分化,又一部DC电影扑街了
2020/04/09 欧美动漫
PHP 将图片按创建时间进行分类存储的实现代码
2010/01/05 PHP
关于PHP中Object对象的笔记分享
2011/06/28 PHP
php cookie使用方法学习笔记分享
2013/11/07 PHP
thinkphp autoload 命名空间自定义 namespace
2015/07/17 PHP
PHP实现图片不变型裁剪及图片按比例裁剪的方法
2016/01/14 PHP
PHP APP微信提现接口代码
2018/09/30 PHP
PHP7 windows支持
2021/03/09 PHP
JSONP获取Twitter和Facebook文章数的具体步骤
2014/02/24 Javascript
使用do...while的方法输入一个月中所有的周日(实例代码)
2016/07/22 Javascript
js获取元素的标签名实现方法
2016/10/08 Javascript
JavaScript初学者必看“new”
2017/06/12 Javascript
vue 系列——vue2-webpack2框架搭建踩坑之路
2017/12/22 Javascript
JavaScript实现正则去除a标签并保留内容的方法【测试可用】
2018/07/18 Javascript
react组件从搭建脚手架到在npm发布的步骤实现
2019/01/09 Javascript
PHPStorm中如何对nodejs项目进行单元测试详解
2019/02/28 NodeJs
python测试驱动开发实例
2014/10/08 Python
python append、extend与insert的区别
2016/10/13 Python
python3.6使用SMTP协议发送邮件
2020/05/20 Python
keras和tensorflow使用fit_generator 批次训练操作
2020/07/03 Python
python 如何快速复制序列
2020/09/07 Python
Python importlib模块重载使用方法详解
2020/10/13 Python
CSS3悬停效果案例应用
2012/11/21 HTML / CSS
探索HTML5本地存储功能运用技巧
2016/03/02 HTML / CSS
世界上最悠久的自行车制造商:Ribble Cycles
2017/03/18 全球购物
MAC彩妆澳洲官网:M·A·C AU
2021/01/17 全球购物
华为c/c++笔试题
2016/01/25 面试题
会计主管岗位职责范文
2013/11/08 职场文书
社团招新策划书
2014/02/04 职场文书
《雕塑之美》教学反思
2014/04/24 职场文书
质检员岗位职责范本
2015/04/07 职场文书
施工安全员岗位职责
2015/04/11 职场文书
看上去很美观后感
2015/06/10 职场文书
旅行社计调工作总结
2015/08/12 职场文书
幼儿园小班开学寄语(2016秋季)
2015/12/03 职场文书
如何撰写促销方案?
2019/07/05 职场文书