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 滑入滑出效果实现代码
Mar 27 Javascript
checkbox设置复选框的只读效果不让用户勾选
Aug 12 Javascript
使用Jquery实现每日签到功能
Apr 03 Javascript
JavaScript运动框架 解决防抖动问题、悬浮对联(二)
May 17 Javascript
Vue2 Vue-cli中使用Typescript的配置详解
Jul 24 Javascript
vue下跨域设置的相关介绍
Aug 26 Javascript
vuejs使用递归组件实现树形目录的方法
Sep 30 Javascript
prototype.js简单实现ajax功能示例
Oct 18 Javascript
详解JavaScript中操作符和表达式
Sep 12 Javascript
vue 的点击事件获取当前点击的元素方法
Sep 15 Javascript
vue按需加载实例详解
Sep 06 Javascript
如何使用 JavaScript 操作浏览器历史记录 API
Nov 24 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
《逃离塔科夫》——“萌新劝退,老手自嗨”的硬核FPS游戏
2020/04/03 其他游戏
很温暖很温暖的Lester Young
2021/03/03 冲泡冲煮
php自动识别文件编码并转换为UTF-8的方法
2014/06/12 PHP
smarty模板引擎之配置文件数据和保留数据
2015/03/30 PHP
Zend Framework教程之Zend_Registry对象用法分析
2016/03/22 PHP
Laravel 5.4.36中session没有保存成功问题的解决
2018/02/19 PHP
JavaScript confirm选择判断
2008/10/18 Javascript
鼠标经过的文本框textbox变色
2009/05/21 Javascript
JQuery toggle使用分析
2009/11/16 Javascript
dojo学习第二天 ajax异步请求之绑定列表
2011/08/29 Javascript
DWZ table的原生分页浅谈
2013/03/01 Javascript
js setTimeout 常见问题小结
2013/08/13 Javascript
jQuery实现冻结表格行和列
2015/04/29 Javascript
JS判断页面是否出现滚动条的方法
2015/07/17 Javascript
JavaScript获取客户端IP的方法(新方法)
2016/03/11 Javascript
基于Bootstrap的UI扩展 StyleBootstrap
2016/06/17 Javascript
vue-resource 拦截器(interceptor)的使用详解
2017/07/04 Javascript
Javascript 一些需要注意的细节(必看篇)
2017/07/08 Javascript
angular使用bootstrap方法手动启动的实例代码
2017/07/18 Javascript
JS实现的按钮点击颜色切换功能示例
2017/10/19 Javascript
webpack+vue2构建vue项目骨架的方法
2018/01/09 Javascript
element 结合vue 在表单验证时有值却提示错误的解决办法
2018/01/22 Javascript
vue-cli3.0配置及使用注意事项详解
2018/09/05 Javascript
微信小程序入口场景的问题集合与相关解决方法
2019/06/26 Javascript
JavaScript基础之this和箭头函数详析
2019/09/05 Javascript
Python中处理时间的几种方法小结
2015/04/09 Python
python爬虫 使用真实浏览器打开网页的两种方法总结
2018/04/21 Python
Python3实现转换Image图片格式
2018/06/21 Python
PyTorch的自适应池化Adaptive Pooling实例
2020/01/03 Python
Python基于numpy模块实现回归预测
2020/05/14 Python
LightInTheBox西班牙站点:全球商品在线采购
2016/09/22 全球购物
日本酒店、民宿、温泉旅馆、当地旅行团中文预订:e路东瀛
2019/12/09 全球购物
资产经营总监岗位职责
2013/12/04 职场文书
销售找工作求职信
2013/12/20 职场文书
2014年国庆节演讲稿精选范文1500字
2014/09/25 职场文书
安全生产标语口号
2015/12/26 职场文书