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 相关文章推荐
一个网马的tips实现分析
Nov 28 Javascript
javascript中String类的subString()方法和slice()方法
May 24 Javascript
基于jquery扩展漂亮的CheckBox(自己编写)
Nov 19 Javascript
动态加载iframe时get请求传递中文参数乱码解决方法
May 07 Javascript
C++中的string类的用法小结
Aug 07 Javascript
jQuery插件FusionCharts绘制的3D饼状图效果实例【附demo源码下载】
Mar 03 Javascript
vue.js之vue-cli脚手架的搭建详解
May 05 Javascript
vue组件表单数据回显验证及提交的实例代码
Aug 30 Javascript
总结javascript三元运算符知识点
Sep 28 Javascript
基于Vue实现图片在指定区域内移动的思路详解
Nov 11 Javascript
JS学习笔记之数组去重实现方法小结
May 29 Javascript
JavaScript实现瀑布流布局的3种方式
Dec 27 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
在JavaScript中调用php程序
2009/03/09 PHP
php绝对路径与相对路径之间关系的的分析
2010/03/03 PHP
php防攻击代码升级版
2010/12/29 PHP
php格式化电话号码的方法
2015/04/24 PHP
PHP Streams(流)详细介绍及使用
2015/05/12 PHP
Yii 2.0实现联表查询加搜索分页的方法示例
2017/08/02 PHP
PHP设计模式之 策略模式Strategy详解【对象行为型】
2020/05/01 PHP
Jquery时间验证和转换工具小例子
2013/07/01 Javascript
jquery显示隐藏input对象
2014/07/21 Javascript
跟我学习javascript的undefined与null
2015/11/17 Javascript
浅谈JS中json数据的处理
2016/06/30 Javascript
开发Vue树形组件的示例代码
2017/12/21 Javascript
新手简单了解vue
2019/05/29 Javascript
layer.confirm点击第一个按钮关闭弹出框的方法
2019/09/09 Javascript
跟老齐学Python之关于类的初步认识
2014/10/11 Python
Python实现Windows上气泡提醒效果的方法
2015/06/03 Python
如何在sae中设置django,让sae的工作环境跟本地python环境一致
2017/11/21 Python
新手如何发布Python项目开源包过程详解
2019/07/11 Python
提升Python效率之使用循环机制代替递归函数
2019/07/23 Python
浅析python 中大括号中括号小括号的区分
2019/07/29 Python
python使用minimax算法实现五子棋
2019/07/29 Python
python被修饰的函数消失问题解决(基于wraps函数)
2019/11/04 Python
Python pip 常用命令汇总
2020/10/19 Python
Python实现FTP文件定时自动下载的步骤
2020/12/19 Python
使用html5 canvas创建太空游戏的示例
2014/05/08 HTML / CSS
雪花秀美国官方网站:韩国著名草本护肤化妆品品牌
2016/10/19 全球购物
波兰品牌鞋履在线商店:Eastend.pl
2020/01/11 全球购物
init进程的作用
2012/04/12 面试题
实习自我鉴定范文
2013/10/30 职场文书
红旗团支部事迹材料
2014/01/27 职场文书
应届毕业生自荐信
2014/05/28 职场文书
新闻人物通讯稿
2014/10/09 职场文书
初中美术教学反思
2016/02/17 职场文书
python编写函数注意事项总结
2021/03/29 Python
Oracle安装TNS_ADMIN环境变量设置参考
2021/11/01 Oracle
Win10防火墙白名单怎么设置?Win10添加防火墙白名单方法
2022/04/06 数码科技