ExtJs异步无法向外传值和赋值的完美解决办法


Posted in Javascript onJune 14, 2017

1、Ext.data.Store.load();方法是异步的,下面的方式获得的reCount始终是0,因为还没等后台的方法执行完就赋值了,此时store的record还没获得值。

var testStore = new Ext.data.GroupingStore({
   proxy : new Ext.data.HttpProxy({
      url : ''
   }),
   reader : new Ext.data.JsonReader({
      root : 'hstamcx',
      totalProperty : "results",
      fields : ["id","value"]
   })
});
Ext.onReady(function(){
     Ext.QuickTips.init();
     Ext.form.Field.prototype.msgTarget = 'side';
     testStore.load (); 
     var reCount = testStore.getCount();
     var port = new Ext.Viewport({
        layout : 'auto',
        frame : true,
        items : [winKey]
     });
});

2、如果想要对加载的值进行处理,必须将后续处理写在回调函数中。

Ext.onReady(function(){
     Ext.QuickTips.init();
     Ext.form.Field.prototype.msgTarget = 'side';
     testStore.load({
        callback : function(r, options, success) {
           var reCount = testStore.getCount();
        }
     });
     var port = new Ext.Viewport({
        layout : 'auto',
        frame : true,
        items : [winKey]
     });
});

此时可以获得reCount的值,并且callback : function(r, options, success)的r就是store加载查到的数据。

但依然存在问题:r的数据值只能在回调函数里面使用,在callback函数里既不能给外部的其他元素赋值,也没有办法将r数据传到外面去 

3、如果想在js页面向后台发送请求,并在外面使用后台返回的数据值,可以使用Ext.Ajax.request,并将请求方式设置成同步,接收数据的变量要定义在Ext.Ajax.request外面   

var cancelMode;
     Ext.Ajax.request({
        url: '',
        method: 'post',
        sync:true, //同步请求
        success: function(response) {
           var response = Ext.util.JSON.decode(response.responseText);
           cancelMode = response.hstamcx[0].param_value;
        }
      });

此时就可以在外面使用Ext.Ajax.request的请求获得的数据了,比如alert(cancelMode );

后台代码示例:该示例是举个大概例子,并不是完整代码

public void getData(HttpServletResponse response){
      TestData td = TestDataDao.getTestdata();
      String message = "{name:" + td .getName()+ ",id:" + td.getId()+ "}";
      PrintWriter out=response.getWriter();
      out.write(message);
      out.flush();
   }

以上所述是小编给大家介绍的ExtJs异步无法向外传值和赋值的完美解决办法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
prototype.js的Ajax对象
Sep 23 Javascript
基于jQuery的图片左右无缝滚动插件
May 23 Javascript
jQuery表格插件ParamQuery简单使用方法示例
Dec 05 Javascript
window.location的重写及判断location是否被重写
Sep 04 Javascript
jquery遍历table的tr获取td的值实现方法
May 19 Javascript
JS复制对应id的内容到粘贴板(Ctrl+C效果)
Jan 23 Javascript
详解Vue生命周期的示例
Mar 10 Javascript
Bootstrap页面标题Page Header的实现方法
Mar 22 Javascript
ES6正则表达式的一些新功能总结
May 09 Javascript
react开发教程之React 组件之间的通信方式
Aug 12 Javascript
Angular实现图片裁剪工具ngImgCrop实践
Aug 17 Javascript
vue axios数据请求get、post方法及实例详解
Sep 11 Javascript
详解Vue爬坑之vuex初识
Jun 14 #Javascript
详解vue2.0的Element UI的表格table列时间戳格式化
Jun 13 #Javascript
微信小程序调用PHP后台接口 解析纯html文本
Jun 13 #Javascript
vue时间格式化实例代码
Jun 13 #Javascript
详解vue slot插槽的使用方法
Jun 13 #Javascript
详解Vue.js分发之作用域槽
Jun 13 #Javascript
Javascript实现从小到大的数组转换成二叉搜索树
Jun 13 #Javascript
You might like
php 动态添加记录
2009/03/10 PHP
兼容各大浏览器带关闭按钮的漂浮多组图片广告代码
2014/06/05 PHP
phpStorm+XDebug+chrome 配置详解
2019/04/01 PHP
Array对象方法参考
2006/10/03 Javascript
一个不错的应用,用于提交获取文章内容,不推荐用
2007/03/03 Javascript
原生javascript模仿win8等待提示圆圈进度条
2014/04/24 Javascript
angularjs实现与服务器交互分享
2014/06/24 Javascript
javascript中关于&& 和 || 表达式的小技巧分享
2015/04/10 Javascript
javascript数据结构之二叉搜索树实现方法
2015/11/25 Javascript
用v-html解决Vue.js渲染中html标签不被解析的问题
2016/12/14 Javascript
详解Angular CLI + Electron 开发环境搭建
2017/07/20 Javascript
浅谈React Native 传参的几种方式(小结)
2019/05/21 Javascript
vue监听用户输入和点击功能
2019/09/27 Javascript
ant-design-vue按需加载的坑的解决
2020/05/14 Javascript
vue通过过滤器实现数据格式化
2020/07/20 Javascript
pyqt4教程之实现windows窗口小示例分享
2014/03/07 Python
使用基于Python的Tornado框架的HTTP客户端的教程
2015/04/24 Python
解读Django框架中的低层次缓存API
2015/07/24 Python
python中list列表的高级函数
2016/05/17 Python
Python版名片管理系统
2018/11/30 Python
Linux上使用Python统计每天的键盘输入次数
2019/04/17 Python
python科学计算之narray对象用法
2019/11/25 Python
解决tensorflow训练时内存持续增加并占满的问题
2020/01/19 Python
python GUI库图形界面开发之PyQt5多行文本框控件QTextEdit详细使用方法实例
2020/02/28 Python
Pycharm配置lua编译环境过程图解
2020/11/28 Python
Python爬虫实战案例之爬取喜马拉雅音频数据详解
2020/12/07 Python
美国著名的品牌折扣店:Burlington
2017/06/08 全球购物
Dodax奥地利:音乐、电影、书籍、玩具、电子产品等
2019/08/31 全球购物
财会自我鉴定范文
2013/12/27 职场文书
《真想变成大大的荷叶》教学反思
2014/04/14 职场文书
公司股东出资证明书
2014/11/01 职场文书
2014预防青少年违法犯罪工作总结
2014/12/10 职场文书
初中语文教学研修日志
2015/11/13 职场文书
HTML基本元素标签介绍
2022/02/28 HTML / CSS
Django + Taro 前后端分离项目实现企业微信登录功能
2022/04/07 Python
Java无向树分析 实现最小高度树
2022/04/09 Javascript