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 匿名函数及其代码模式原理
Mar 19 Javascript
jquery基础教程之数组使用详解
Mar 10 Javascript
使用pcs api往免费的百度网盘上传下载文件的方法
Mar 17 Javascript
JavaScript事件学习小结(五)js中事件类型之鼠标事件
Jun 09 Javascript
详解jQuery插件开发方式
Nov 22 Javascript
AngularJS过滤器filter用法分析
Dec 11 Javascript
JavaScript上传文件时不用刷新页面方法总结(推荐)
Aug 15 Javascript
利用jsonp与代理服务器方案解决跨域问题
Sep 14 Javascript
详解vue项目中如何引入全局sass/less变量、function、mixin
Jun 02 Javascript
javascript显示动态时间的方法汇总
Jul 06 Javascript
详解50行代码,Node爬虫练手项目
Apr 22 Javascript
详解Vue3.0 + TypeScript + Vite初体验
Feb 22 Vue.js
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获取本周,上周,本月,上月,本季度日期的代码
2009/08/05 PHP
header导出Excel应用示例
2014/01/24 PHP
PHP文件上传问题汇总(文件大小检测、大文件上传处理)
2015/12/24 PHP
Laravel 中使用简单的方法跟踪用户是否在线(推荐)
2019/10/30 PHP
彻底搞懂JS无缝滚动代码
2007/01/03 Javascript
jquery异步调用页面后台方法‏(asp.net)
2011/03/01 Javascript
js中top的作用深入剖析
2014/03/04 Javascript
JS+CSS实现弹出全屏灰黑色透明遮罩效果的方法
2014/12/20 Javascript
javascript递归回溯法解八皇后问题
2015/04/22 Javascript
JS实现上下左右对称的九九乘法表
2016/02/22 Javascript
ES6概念 Symbol.keyFor()方法
2016/12/25 Javascript
微信小程序实现图片自适应(支持多图)
2017/01/25 Javascript
nodejs 终端打印进度条实例代码
2017/04/22 NodeJs
基于jQuery实现手风琴菜单、层级菜单、置顶菜单、无缝滚动效果
2017/07/20 jQuery
layui框架中layer父子页面交互的方法分析
2017/11/15 Javascript
ReactNative 之FlatList使用及踩坑封装总结
2017/11/29 Javascript
Vue加载组件、动态加载组件的几种方式
2018/08/31 Javascript
浅谈React之状态(State)
2018/09/19 Javascript
[02:41]DOTA2英雄基础教程 冥魂大帝
2014/01/16 DOTA
[02:43]2018DOTA2亚洲邀请赛主赛事首日TOP5
2018/04/04 DOTA
Python中atexit模块的基本使用示例
2015/07/08 Python
用python爬取租房网站信息的代码
2018/12/14 Python
django url到views参数传递的实例
2019/07/19 Python
安装多个版本的TensorFlow的方法步骤
2020/04/21 Python
需要知道的CSS3动画技术
2010/01/01 HTML / CSS
纯CSS3制作的鼠标悬停时边框旋转
2017/01/03 HTML / CSS
CSS3之2D与3D变换的实现方法
2019/01/28 HTML / CSS
简约控的天堂:The Undone
2016/12/21 全球购物
Nike荷兰官方网站:Nike.com (NL)
2018/04/19 全球购物
新英格兰最大的特色礼品连锁店:The Paper Store
2018/07/23 全球购物
是否可以从一个static方法内部发出对非static方法的调用?
2014/08/18 面试题
幼儿园教研活动方案
2014/01/19 职场文书
淘宝客服专员岗位职责
2015/04/07 职场文书
运动员代表致辞
2015/07/29 职场文书
如何创建一个创建MySQL数据库中的datetime类型
2022/03/21 MySQL
如何开启Apache,Nginx和IIS服务器的GZIP压缩功能
2022/04/29 Servers