基于ExtJs在页面上window再调用Window的事件处理方法


Posted in Javascript onJuly 26, 2017

今天在开发Ext的过程中遇到了一个恶心的问题,就是在ext.window页面,点击再次弹出window时,gridpanel中的store数据加载异常,不能正常被加载,会出现缓存,出现该问题,是因为window窗口弹出时,两个window同时存在,并且在两个window交替使用时,需要先将一个窗口关闭,关闭时,会对window的缓存进行清理,这样就能保证store数据的正确加载。分享给大家,供参考。

var actInfoWindow2;
function showCallFlowInfoWindow(flowid, actId) {
  var actWindowHeight1 = window.innerHeight
  || document.documentElement.clientHeight
  || document.body.clientHeight;
  if(null != upldWin && undefined != upldWin && "" != upldWin){
    upldWin.close();
  }
  // 异常活动模型
  Ext.define('callFlowModel', {
    extend: 'Ext.data.Model',
    fields: [{name: 'instance', type: 'string'},
         {name: 'flowName', type: 'string'},
         {name: 'prjName', type: 'string'},
         {name: 'startTime',  type: 'String'}]
  });
   
  callFlowStore = Ext.create('Ext.data.Store', {
    autoLoad : true,
    model : 'callFlowModel',
    proxy : {
      type : 'ajax',
      url : 'subflow.do',
      reader : {
        type : 'json',
        root : 'callFlowList',
        totalProperty : 'total'
      }
    }, 
    listeners: { 
      'beforeload': function (store, op, options) {
        var params = { 
          //参数 
          flowId : flowid,
          id : actId
        }; 
        Ext.apply(store.proxy.extraParams, params); 
      } 
    } 
  });
   
  // 绑定数据模型flowColumns
  var callFlowColumns = [
    { text: '实例名', dataIndex: 'instance', width:174 },
    { text: '工程名', dataIndex: 'prjName',width: 174 },
    { text: '工作流名', dataIndex: 'flowName',width: 174 },
    { text: '启动时间', dataIndex: 'startTime',width: 174 }
  ];
 
  callFlowGrid = Ext.create('Ext.grid.Panel', {
    region : 'center',
    //tbar:querybar,
    id:'callFlowList',
    autoScroll : false,
    border:false,
    //columnLines : true,
    //selModel:selModel,
    //bbar : pageBar,
    columns : callFlowColumns,
    store : callFlowStore,
    loadMask : {
      msg : " 数据加载中,请稍等 "
    }
  });
   
  if (actInfoWindow2 == undefined || !actInfoWindow2.isVisible()) {
    actInfoWindow2 = Ext.create('Ext.window.Window', {
      id : 'actInfoWindow2',
      title : '活动信息详情',
      modal : true,
      closeAction : 'destroy',
      constrain : true,
      autoScroll : true,
      width : 700,
      height : actWindowHeight1 - 300,
      items : [ callFlowGrid ],
      listeners:{
         beforeclose:function(){
           actInfoWindow2.destroy();
         }
      }
    });
  }
  actInfoWindow2.show();
}
if(null != upldWin && undefined != upldWin && "" != upldWin){

  upldWin.close();
}

我的问题出现就是因为没有添加上面黄色背景的代码片段导致的错误。供大家参考。两个window交替使用时,需要交替关闭,这样才能保证页面的正常。ExtJs不建议弹出多window同时使用,当然,如果能解决好ExtJs之间的数据交互,也未必不可以。

以上这篇基于ExtJs在页面上window再调用Window的事件处理方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript四种调用模式和this示例介绍
Jan 02 Javascript
javaScript使用EL表达式的几种方式
May 27 Javascript
JavaScript DOM进阶方法
Apr 13 Javascript
js漂浮广告实现代码
Aug 15 Javascript
jQuery定义插件的方法
Dec 18 Javascript
Bootstrap进度条组件知识详解
May 01 Javascript
微信小程序网络请求wx.request详解及实例
May 18 Javascript
Angular2生命周期钩子函数的详细介绍
Jul 10 Javascript
Angular 项目实现国际化的方法
Jan 08 Javascript
jQuery实现的记住帐号密码功能完整示例
Aug 03 jQuery
Vue中使用Lodop插件实现打印功能的简单方法
Dec 19 Javascript
JavaScript命令模式原理与用法实例详解
Mar 10 Javascript
Angular中自定义Debounce Click指令防止重复点击
Jul 26 #Javascript
JavaScript利用fetch实现异步请求的方法实例
Jul 26 #Javascript
深入探究angular2 UI组件之primeNG用法
Jul 26 #Javascript
WdatePicker.js时间日期插件的使用方法
Jul 26 #Javascript
关于Stream和Buffer的相互转换详解
Jul 26 #Javascript
JS 60秒后重新发送验证码的实例讲解
Jul 26 #Javascript
JS数组操作中的经典算法实例讲解
Jul 26 #Javascript
You might like
利用PHP和AJAX创建RSS聚合器的代码
2007/03/13 PHP
php下将XML转换为数组
2010/01/01 PHP
php 网上商城促销设计实例代码
2012/02/17 PHP
Linux下安装Memcached服务器和客户端与PHP使用示例
2019/04/15 PHP
return false;和e.preventDefault();的区别
2010/07/11 Javascript
jQuery聚合函数实例
2015/05/21 Javascript
浅谈JavaScript的自动垃圾收集机制
2016/12/15 Javascript
详解node如何让一个端口同时支持https与http
2017/07/04 Javascript
全新打包工具parcel零配置vue开发脚手架
2018/01/11 Javascript
解决VUE中document.body.scrollTop为0的问题
2018/09/15 Javascript
超好用的jQuery分页插件jpaginate用法示例【附源码下载】
2018/12/06 jQuery
Vue 组件参数校验与非props特性的方法
2019/02/12 Javascript
Node.js之删除文件夹(含递归删除)代码实例
2019/09/09 Javascript
微信小程序后端(java)开发流程的详细步骤
2019/11/13 Javascript
JavaScript多种滤镜算法实现代码实例
2019/12/10 Javascript
JS数组方法push()、pop()用法实例分析
2020/01/18 Javascript
详细介绍Python的鸭子类型
2016/09/12 Python
使用matplotlib画散点图的方法
2018/05/25 Python
pytorch-RNN进行回归曲线预测方式
2020/01/14 Python
Python通过2种方法输出带颜色字体
2020/03/02 Python
django实现将修改好的新模型写入数据库
2020/03/31 Python
python安装后的目录在哪里
2020/06/21 Python
python 调用Google翻译接口的方法
2020/12/09 Python
python通过cython加密代码
2020/12/11 Python
Python 中 sorted 如何自定义比较逻辑
2021/02/02 Python
印度和世界各地的精美产品:Ikka Dukka
2018/02/12 全球购物
英国受欢迎的运动鞋和街头服装商店:Footasylum
2018/06/12 全球购物
社团活动总结范文
2014/04/26 职场文书
驾驶员培训方案
2014/05/01 职场文书
党员教师个人对照检查材料范文
2014/09/25 职场文书
副总经理岗位职责
2015/02/02 职场文书
食品安全责任书范本
2015/05/09 职场文书
电视新闻稿
2015/07/17 职场文书
礼仪培训心得体会
2016/01/22 职场文书
纪念建国70周年演讲稿
2019/07/19 职场文书
Django drf请求模块源码解析
2021/06/08 Python