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高级程序设计(第3版)学习笔记2 js基础语法
Oct 11 Javascript
jQuery仿Excel表格编辑功能的实现代码
May 01 Javascript
js读取json的两种常用方法示例介绍
Oct 19 Javascript
director.js实现前端路由使用实例
Feb 03 Javascript
jQuery简单实现禁用右键菜单
Mar 10 Javascript
基于jquery实现左右按钮点击的图片切换效果
Jan 27 Javascript
JavaScript文档碎片操作实例分析
Dec 12 Javascript
jQuery实现的兼容性浮动层示例
Aug 02 Javascript
手机端点击图片放大特效PhotoSwipe.js插件实现
Aug 24 Javascript
ajax级联菜单实现方法实例分析
Nov 28 Javascript
Angular弹出模态框的两种方式
Oct 19 Javascript
vue 动态创建组件的两种方法
Dec 31 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 中的str_replace 函数总结
2007/04/27 PHP
PHP之预定义接口详解
2015/07/29 PHP
Thinkphp单字母函数使用指南
2016/05/08 PHP
PHP中使用CURL发送get/post请求上传图片批处理功能
2018/10/15 PHP
php的优点总结 php有哪些优点
2019/07/19 PHP
ext实现完整的登录代码
2008/08/08 Javascript
jquery提示 "object expected"的解决方法
2009/12/13 Javascript
热点新闻滚动特效的js代码
2013/08/17 Javascript
深入分析JSONP跨域的原理
2014/12/10 Javascript
jQuery实现视频作为全屏幕背景
2014/12/18 Javascript
jQuery实现定时读取分析xml文件的方法
2015/07/16 Javascript
Windows下用PyCharm和Visual Studio开始Python编程
2015/10/26 Javascript
JavaScript计算值然后把值嵌入到html中的实现方法
2016/10/29 Javascript
javascript实现用户点击数量统计
2016/12/25 Javascript
JS中使用正则表达式g模式和非g模式的区别
2017/04/01 Javascript
JS判断微信扫码的方法
2017/08/07 Javascript
JS字典Dictionary类定义与用法示例
2019/02/01 Javascript
Javascript读取上传文件内容/类型/字节数
2019/04/30 Javascript
JavaScript算法学习之冒泡排序和选择排序
2019/11/02 Javascript
[01:01:01]完美世界DOTA2联赛循环赛 GXR vs FTD BO2第一场 10.29
2020/10/29 DOTA
python实现web方式logview的方法
2015/08/10 Python
Python语言实现获取主机名根据端口杀死进程
2016/03/31 Python
Python实现删除时保留特定文件夹和文件的示例
2018/04/27 Python
Python使用matplotlib绘制随机漫步图
2018/08/27 Python
Python基础知识点 初识Python.md
2019/05/14 Python
selenium 安装与chromedriver安装的方法步骤
2019/06/12 Python
Python3常见函数range()用法详解
2019/12/30 Python
简单了解Python多态与属性运行原理
2020/06/15 Python
matplotlib 三维图表绘制方法简介
2020/09/20 Python
通过css3动画和opacity透明度实现呼吸灯效果
2019/08/09 HTML / CSS
监理员的岗位职责
2013/11/13 职场文书
安全生产一岗双责责任书
2014/07/28 职场文书
2014年终工作总结范本
2014/12/15 职场文书
2015年销售人员工作总结
2015/04/07 职场文书
python 用递归实现通用爬虫解析器
2021/04/16 Python
golang 实现对Map进行键值自定义排序
2021/04/28 Golang