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 相关文章推荐
在网页中屏蔽快捷键
Sep 06 Javascript
JavaScript中一个奇葩的IE浏览器判断方法
Apr 16 Javascript
JavaScript字符串对象substr方法入门实例(用于截取字符串)
Oct 16 Javascript
Javascript实现div的toggle效果实例分析
Jun 09 Javascript
jquery validate demo 基础
Oct 29 Javascript
js验证真实姓名与身份证号,手机号的简单实例
Jul 18 Javascript
javascript表单正则应用
Feb 04 Javascript
详解AngularJS controller调用factory
May 19 Javascript
jQuery选择器之表单元素选择器详解
Sep 19 jQuery
jquery引入外部CDN 加载失败则引入本地jq库
May 23 jQuery
解决Vue.js父组件$on无法监听子组件$emit触发事件的问题
Sep 12 Javascript
微信小程序错误this.setData报错及解决过程
Sep 18 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
php xml-rpc远程调用
2008/12/19 PHP
php数组函数序列之sort() 对数组的元素值进行升序排序
2011/11/02 PHP
ThinkPHP权限认证Auth实例详解
2014/07/22 PHP
ThinkPHP5.0框架验证码功能实现方法【基于第三方扩展包】
2019/03/11 PHP
js 操作css实现代码
2009/06/11 Javascript
NodeJs中的非阻塞方法介绍
2012/06/05 NodeJs
JS实现点击图片在当前页面放大并可关闭的漂亮效果
2013/10/18 Javascript
淘宝网提供的国内NPM镜像简介和使用方法
2014/04/17 Javascript
介绍JavaScript的一个微型模版
2015/06/24 Javascript
jQuery position() 函数详解以及jQuery中position函数的应用
2015/12/14 Javascript
bootstrap-datetimepicker实现只显示到日期的方法
2016/11/25 Javascript
bootstrap confirmation按钮提示组件使用详解
2017/08/22 Javascript
jquery+ajax实现上传图片并显示上传进度功能【附php后台接收】
2019/06/06 jQuery
微信小程序 bindtap 传参的实例代码
2020/02/21 Javascript
[01:19]DOTA2城市挑战赛报名开始 开启你的城市传奇
2018/03/23 DOTA
[40:06]DOTA2亚洲邀请赛 4.3 突围赛 Liquid vs VGJ.T 第一场
2018/04/04 DOTA
Ruby使用eventmachine为HTTP服务器添加文件下载功能
2016/04/20 Python
Python如何实现守护进程的方法示例
2017/02/08 Python
Python嵌套函数,作用域与偏函数用法实例分析
2019/12/26 Python
matplotlib自定义鼠标光标坐标格式的实现
2021/01/08 Python
canvas实现漂亮的下雨效果的示例
2018/04/18 HTML / CSS
劳力士官方珠宝商:J.R. Dunn Jewelers
2018/09/29 全球购物
元旦晚会感言
2014/03/12 职场文书
保密工作责任书
2014/04/16 职场文书
小学生作文评语大全
2014/04/21 职场文书
七一讲话心得体会
2014/09/05 职场文书
致800米运动员广播稿(10篇)
2014/10/17 职场文书
2014年食品安全工作总结
2014/12/04 职场文书
公司感谢信范文
2015/01/22 职场文书
上课说话检讨书
2015/01/27 职场文书
会计专业自荐信范文
2015/03/05 职场文书
国庆节新闻稿
2015/07/17 职场文书
提档介绍信范文
2015/10/22 职场文书
2016年党员公开承诺书格式范文
2016/03/24 职场文书
2019通用版导游词范本!
2019/08/07 职场文书
HTML5简单实现添加背景音乐的几种方法
2021/05/12 HTML / CSS