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 相关文章推荐
JQuery 自定义CircleAnimation,Animate方法学习笔记
Jul 10 Javascript
JS判定是否原生方法
Jul 22 Javascript
jquery简单的拖动效果实现原理及示例
Jul 26 Javascript
Javascript实现简单的富文本编辑器附演示
Jun 16 Javascript
教你如何自定义百度分享插件以及bshare分享插件的分享按钮
Jun 20 Javascript
jQuery中parent()方法用法实例
Jan 07 Javascript
ES6中如何使用Set和WeakSet
Mar 10 Javascript
Angular.js如何从PHP读取后台数据
Mar 24 Javascript
JS脚本实现动态给标签控件添加事件的方法
Jun 02 Javascript
JS滚动到指定位置导航栏固定顶部
Jul 03 Javascript
基于Bootstrap模态对话框只加载一次 remote 数据的解决方法
Jul 09 Javascript
实现一个完整的Node.js RESTful API的示例
Sep 29 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 array_intersect()函数使用代码
2009/01/14 PHP
关于php 接口问题(php接口主要也就是运用curl,curl函数)
2013/07/01 PHP
php简单随机字符串生成方法示例
2017/04/19 PHP
Windows 下安装 swoole 图文教程(php)
2017/06/05 PHP
基于jquery的15款幻灯片插件
2011/04/10 Javascript
浅谈JavaScript中null和undefined
2015/07/09 Javascript
详解JavaScript中常用的函数类型
2015/11/18 Javascript
JS清除字符串中重复值的实现方法
2016/08/03 Javascript
JSONP跨域请求
2017/03/02 Javascript
jQuery实现字体颜色渐变效果的方法
2017/03/29 jQuery
JS实现仿UC浏览器前进后退效果的实例代码
2017/07/17 Javascript
Node.js利用断言模块assert进行单元测试的方法
2017/09/28 Javascript
微信小程序 页面滑动事件的实例详解
2017/10/12 Javascript
基于javascript中的typeof和类型判断(详解)
2017/10/27 Javascript
js图片查看器插件用法示例
2019/06/22 Javascript
Vue.js 中的实用工具方法【推荐】
2019/07/04 Javascript
js回调函数原理与用法案例分析
2020/03/04 Javascript
python翻译软件实现代码(使用google api完成)
2013/11/26 Python
Python的加密模块md5、sha、crypt使用实例
2014/09/28 Python
Python中自定义函数的教程
2015/04/27 Python
Python 中pandas.read_excel详细介绍
2017/06/23 Python
Python无损音乐搜索引擎实现代码
2018/02/02 Python
基于python list对象中嵌套元组使用sort时的排序方法
2018/04/18 Python
Python3利用Dlib19.7实现摄像头人脸识别的方法
2018/05/11 Python
Numpy截取指定范围内的数据方法
2018/11/14 Python
Python小进度条显示代码
2019/03/05 Python
基于python traceback实现异常的获取与处理
2019/12/13 Python
CSS3 实现侧边栏展开收起动画
2014/12/22 HTML / CSS
夏尔巴人登珠峰品牌:Sherpa Adventure Gear
2018/02/08 全球购物
先进工作者获奖感言
2014/02/08 职场文书
2014年清明节网上祭英烈寄语
2014/04/09 职场文书
预备党员转正考核材料
2014/06/03 职场文书
公司总经理岗位职责范本
2014/08/15 职场文书
社区党的群众路线教育实践活动剖析材料
2014/10/09 职场文书
react使用antd的上传组件实现文件表单一起提交功能(完整代码)
2021/06/29 Javascript
python中__slots__节约内存的具体做法
2021/07/04 Python