打开包含ExtJS网格的浏览器弹出窗口的最佳方法

时间:2017-07-05 08:17:38

标签: javascript extjs internet-explorer-11 extjs6

在我们的ExtJS应用程序中,我们有一些菜单和一个标签面板。点击menuItem即可打开网格。

我们要求用户可以在以下两种模式中的任何一种模式下打开包含网格的显示:

  1. 内联 - 网格将作为tabpanel
  2. 中的标签项打开
  3. 弹出窗口 - 使用window.open和整个打开新的浏览器窗口 首先加载ExtJS库,然后加载网格。 弹出窗口作为浏览器窗口是为了方便多个监视器
  4. 所以这里的问题是每当我们打开弹出窗口时都需要ExtJS库,并且它占用了IE中的大量内存。

    有没有其他方法可以在不加载整个ExtJS框架的情况下使用ExtJS网格加载浏览器窗口弹出窗口?

    或者任何其他想法都是最受欢迎的,因为我们在IE中确实面临很多内存问题而且用户不愿意使用chrome。

    提前致谢。

3 个答案:

答案 0 :(得分:8)

如果不首先在新窗口中加载Ext框架(或至少是网格所需的部件),则无法将网格加载到新窗口中。您无法访问父窗口的ExtJS框架的副本并使用它,因为ExtJS要求组件在同一窗口中才能正常工作。部分原因是浏览器安全禁止在Windows之间复制或共享某些结构,部分原因是ExtJS架构。

关于浏览器安全性,当您复制网格内容时甚至可能会出现问题。确保您测试所有不同的浏览器。在窗口之间复制数据可能需要您序列化和反序列化以在所有浏览器中工作。例如,我无法在浏览器窗口和Chrome中的iframe之间复制简单的javascript日期,它们出现了null。我不得不序列化记录,传输它们,然后再次反序列化它们:

var serializedRecords = dataStore.getRange().map(function(record) { 
    return record.getData({serialize:true, persist:true}); // <- serialization required
});
iframe.contentWindow.Ext.getStore("DataStore").
    loadRawData(serializedRecords); // <- loadRawData deserializes records
},

答案 1 :(得分:3)

如何执行

var popupWin = window.open('...');
popupWin.Ext = window.Ext;

并且不在子窗口中加载ExtJs

答案 2 :(得分:0)

有一种名为Sencha CMD的工具。 只需构建定义为依赖项的Ext js部分(在组件定义中需要部分)。所以Ext JS附带的所有其他组件都将被忽略。 您必须下载ext js源并找出如何使用该工具

http://docs.sencha.com/cmd/