基于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 相关文章推荐
JQuery设置和去除disabled属性的5种方法总结
May 16 Javascript
Jquery图片延迟加载插件jquery.lazyload.js的使用方法
May 21 Javascript
详解Javascript动态操作CSS
Dec 08 Javascript
Javascript代码实现仿实例化类
Apr 03 Javascript
浅谈JSON.parse()和JSON.stringify()
Jul 14 Javascript
JQuery中ajax方法访问web服务实例
Jul 18 Javascript
在js中实现邮箱格式的验证方法(推荐)
Oct 24 Javascript
利用JS轻松实现获取表单数据
Dec 06 Javascript
微信小程序 picker 组件详解及简单实例
Jan 10 Javascript
Bootstrap导航简单实现代码
Mar 06 Javascript
Angular实现的进度条功能示例
Feb 18 Javascript
vue中img src 动态加载本地json的图片路径写法
Apr 25 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获取字段名示例分享
2014/03/03 PHP
php 实现一个字符串加密解密的函数实例代码
2016/11/01 PHP
详解PHP安装mysql.so扩展的方法
2016/12/31 PHP
PHP简单获取上月、本月、近15天、近30天的方法示例
2017/07/03 PHP
使用Javascript和DOM Interfaces来处理HTML
2006/10/09 Javascript
javascript数组的扩展实现代码集合
2008/06/01 Javascript
javascript 网页跳转的方法
2008/12/24 Javascript
表格 隔行换色升级版
2009/11/07 Javascript
document.getElementById方法在Firefox与IE中的区别
2010/05/18 Javascript
javascript 全等号运算符使用说明
2010/05/31 Javascript
JS完整获取IE浏览器信息包括类型、版本、语言等等
2014/05/22 Javascript
浅析location.href跨窗口调用函数
2016/11/22 Javascript
Javascrip实现文字跳动特效
2016/11/27 Javascript
js for循环倒序输出数组元素的实例
2017/03/01 Javascript
vue中axios处理http发送请求的示例(Post和get)
2017/10/13 Javascript
JS获取当前地理位置的方法
2017/10/25 Javascript
js插件实现图片滑动验证码
2020/09/29 Javascript
vue中v-for加载本地静态图片方法
2018/03/03 Javascript
微信小程序实现图片上传功能
2018/05/28 Javascript
微信小程序实现原生步骤条
2019/07/25 Javascript
layui type2 通过url给iframe子页面传值的例子
2019/09/06 Javascript
Vue中使用better-scroll实现轮播图组件
2020/03/07 Javascript
[38:39]完美世界DOTA2联赛循环赛 IO vs GXR BO2第二场 11.04
2020/11/05 DOTA
python实现的一个p2p文件传输实例
2014/06/04 Python
wxpython实现按钮切换界面的方法
2019/11/19 Python
python绘制封闭多边形教程
2020/02/18 Python
django-利用session机制实现唯一登录的例子
2020/03/16 Python
基于python实现简单C/S模式代码实例
2020/09/14 Python
python 读取串口数据的示例
2020/11/09 Python
CSS3新增布局之: flex详解
2020/06/18 HTML / CSS
J.Crew官网:美国知名休闲服装品牌
2017/05/19 全球购物
美国婚礼装饰和活动用品批发供应商:Event Decor Direct
2018/10/12 全球购物
eBay荷兰购物网站:eBay.nl
2020/06/26 全球购物
事业单位个人应聘自荐信
2013/09/21 职场文书
公司周年庆典标语
2014/10/07 职场文书
pytorch加载预训练模型与自己模型不匹配的解决方案
2021/05/13 Python