`

Ext出现的问题:this.dom is undefined

    博客分类:
  • JS
 
阅读更多

问题描述:

      首先一个带有grid的页面,此页面弹出一个窗口,此窗口选择一些数据返回给父页面也就是那个带有grid的页面;数据填充好了而父页面却无法提交提示 this.dom is undefined。   

 

解决方法:

   弹出的窗口的closeAction的不要设置为close,要设置成hide和弹出的窗口的关闭方式改为win.hide()就好了!

 

原因不明!

 

var win = new Ext.Window({
   layout : '',
   title : '',
   closeAction : 'hide',//如果值是close 可能会产生this.dom is undefined
   items : {},
   buttons: [{
        text: '保 存',
        handler:function(){}
              },{
                text: '取 消',
  handler:function(){
    win.close();//win.hiden()可能会产生页面元素错乱的情况
              }
            }]
});

close () : void
关闭窗口,从DOM中删除它,并销毁窗口对象。 在关闭之前触发beforeclose事件,如果事件处理器返回...
在关闭之前触发beforeclose事件,如果事件处理器返回false则取消关闭操作 Closes the Window, removes it from the DOM, 销毁window对象 和所有子控件. 在关闭之前触发 beforeclose事件 如果

事件处理器返回false则取消关闭操作


注: 此方法不会被 closeAction 设置影响,仅当点击 'close'顶部按钮有影响. 如果要隐藏window并不销毁,调用 hide方法.

参数:
     无。
返回值:
     void


hide ([ String/Element animateTarget ],  [ Function callback ],  [ Object scope ] ) : Ext.Window
隐藏窗口,将其设置为不可见,并设置一个负数偏移量。
 
 参数:
    1、animateTarget : String/Element
       (可选)目标元素或者id,在window隐藏时动画效果的起始处 (默认为null,没有动画效果)
    2、callback : Function
       (可选)在window被隐藏后需要调用的回调函数
    3、scope : Object
       (可选)作用域( this 引用)回调函数将在其中被执行。默认为当前window.
 返回值:
    1、Ext.Window
       this

 

------------------------------------------------转载----------------------------------------------------------------

 

1.使用Ext新增一个弹出窗口(组件)时,窗口(组件)的配置对象里的id属性如果和页面上的某个元素E的id相同时,组件会被渲染到元素E上,如果元素E的样式和弹出窗口(组件)的样式不一致时,会导致窗口不能被正常显示。如:

<html>
<head><title>Ext Js</title>
<link href="ext/resources/css/ext-all.css" type="text/css" rel="stylesheet"/>
<script language="javascript" src="ext/adapter/ext/ext-base.js"></script>
<script language="javascript" src="ext/ext-all.js"></script>
<script language="javascript">
function genWindow()
{
  var _window = new Ext.Window({id:'treeWindow',border:0,layout:'fit',modal:true,width:200,height:350,html:'myWindow'});
//与页面上的div treeWindow冲突,弹出窗口不能被正常显示
  _window.show();
}
Ext.onReady(function(genWindow();));
</script>
<body>
<div id="treeWindow" style="height:400px; width:500px; text-align:center;">content</div>
</body>
</html>

 

2.Ext弹出窗口(组件)的隐藏和销毁:如果窗口(组件)的内容不是动态获取的,并且有多次调用窗口(组件)的情况或可能时,则需要使用单例模式来创建弹出窗口(组件)对象,并且窗口(组件)的属性closeAction:'hide'(如果有使用窗口的'X'关闭功能),用hide()方法隐藏弹出窗口(组件),而不能closeAction:'hide'或者用close()方法将窗口(组件)销毁.因为用closeAction:'hide'或者用close()方法会将窗口(组件)销毁的同时也将页面上的静态内容一并销毁,第二次调用就会出错(不正常)或者没有内容。

   function openTeachPlanList()
   {
                /**************************************************************************
                 *如果不是动态内容,并且此方法可能调用多次时,配置窗口属性closeAction:'hide',
                 *不然可能会出现第二次调用此方式时,静态内容已经被删除。
                 *每次调用此方法先检查窗口是否已经打开(隐藏)了,是则show(),否则创建
                 *这种情况属于单例模式的应用,需遵守单例的规则
                ***************************************************************************/
                   if(Ext.getCmp('_tplWindow'))
                {
                        Ext.getCmp('_tplWindow').show();
                        return;
                }
                        
                var tplWin = new Ext.Window({
                        id:'_tplWindow',
                        contentEl:'teachPlanList',//静态内容
                        title:'教案列表',
                        border:0,
                        layout:'fit',
                        buttonAlign:'center',
                        closeAction:'hide',//注意这里使用了hide
                        modal:true,
                        width:500,
                        height:250
                });
                
                tplWin.show();
   }

 

3、Extjs.Window中closeAction:"hide":是将window隐藏,用window.show()可以将它再次显示出来。这样就导致一个问题,如果其他事件调用此window,那么window的部分控件就会因重名而显示不出来。要想显示出来,就得将Window的 closeAction属性改成"close",这样关闭window就将它从内存中撤销了。其他事件调用此window又可以正常显示了。

 

 

分享到:
评论

相关推荐

    JMeterPlugins.jar

    JMeter导入jmx运行脚本时出现这样的错误jmeter.save.SaveService: Conversion error com.thoughtworks.xstream.converters.ConversionException:2016/12/20 13:51:55 ERROR - jmeter.save.SaveService: Conversion ...

    Ext Js权威指南(.zip.001

    4.2.1 平台检测工具:ext.is / 107 4.2.2 当前运行环境检测工具:ext.supports / 109 4.3 ext js的静态方法 / 112 4.3.1 概述 / 112 4.3.2 ext.object中的静态方法 / 113 4.3.3 ext.function中的静态方法 / ...

    org.restlet.ext.servlet-2.1.1.jar

    org.restlet.ext.servlet-2.1.1.jar

    xml-apis-ext-1.3.04.jar

    xml-apis-ext-1.3.04.jar

    flex文件上传源码

    param.Ext = (this.parameters.Ext == undefined || this.parameters.Ext == "") ? "*.*" : this.parameters.Ext;//上传的文件类型类型限制,空值表示不限制,默认值为*.* param....

    extjs-Ext.ux.form.LovCombo下拉框

    在EXTJS框架中,`Ext.ux.form.LovCombo`是一种自定义组件,它扩展了基本的`Ext.form.field.ComboBox`,提供了更丰富的功能,尤其是针对多选和联动选择的需求。这个组件通常用于创建具有“lov”(即“Look Up Value”...

    编译PHP 报错:node.c: In function dom_canonicalization-附件资源

    编译PHP 报错:node.c: In function dom_canonicalization-附件资源

    org.restlet.ext.servlet

    看名字,有需要下jar包

    ext-4.2.1.883.jsb2

    从spket IDE 官网下载。 文件名: ext-4.2.1.883.jsb2 对应版本ext-4.2.*版本。spket自动提示ExtJs4,需要ext4.2.1.jsp2文件。

    ExtJs选中var editor = new Ext.ux.grid.RowEditor详解

    ### ExtJs选中 `var editor = new Ext.ux.grid.RowEditor` 详解 在Web开发领域,特别是使用ExtJs框架进行复杂用户界面构建时,`RowEditor` 是一个非常实用的功能,它允许用户直接在表格行内编辑数据,极大地提高了...

    ext4-exactor.zip

    4. **故障排查**:在系统出现问题时,EXT4-extractor可以帮助开发者定位问题,例如检查文件系统的完整性,查找错误的文件分配等。 使用EXT4-extractor时,你需要一个EXT4格式的磁盘映像文件,这通常可以通过在...

    Ext.ux.tree.treegrid异步加载

    ### Ext.ux.tree.TreeGrid 异步加载知识点详解 #### 一、Ext.ux.tree.TreeGrid简介 在ExtJS框架中,`Ext.ux.tree.TreeGrid`组件是一种结合了树形结构与表格显示特性的控件,适用于展示具有层级关系的数据。通过...

    jcifs-ext-0.9.4.zip

    &lt;groupId&gt;org.samba.jcifs &lt;artifactId&gt;jcifs-ext &lt;version&gt;0.9.4 &lt;/dependency&gt;

    EXT dojochina文本框示例Ext.form.TextField.rar

    在本示例中,"EXT dojochina文本框示例Ext.form.TextField.rar"是一个压缩包,包含了EXT框架中关于`Ext.form.TextField`组件的示例代码。 `Ext.form.TextField`是EXT框架中的一个核心组件,用于创建基本的输入字段...

    Ext.get与Ext.fly 的区别

    在EXTJS这个强大的JavaScript框架中,`Ext.get`和`Ext.fly`是两个非常重要的方法,它们都用于操作DOM元素,但它们之间存在着微妙的差异。了解这些差异对于优化代码性能和理解EXTJS的工作机制至关重要。 首先,`Ext....

    ExtJS 4.0 改善Ext.grid.plugin.RowEditing (重构,v1.4版本,2011-09-11)

    这篇文章的标题指出这是一个关于“Ext.grid.plugin.RowEditing”的重构,版本为v1.4,发布日期为2011年9月11日。重构通常意味着代码的改进,可能涉及性能优化、错误修复或功能增强。在4.0版本中,RowEditing插件的...

    Ext.data.Store的基本用法

    ### Ext.data.Store的基本用法详解 #### 一、Ext.data.Store简介 `Ext.data.Store`是ExtJS框架中用于管理数据的核心组件之一。它主要负责数据的存储、加载、更新等操作,并且提供了多种方法来方便地处理这些数据。...

    extjs 4.1.1a datetimefield 日期时间选择框

    Ext.Loader.setConfig({ disableCaching: false, enabled: true, paths: { 'Ext': '../../ext-4.1.1', 'Ext.ex': '.' } }); Ext.require([ 'Ext.ex.form.field.DateTime' ]); { xtype : 'datetimefield'...

    EXT dojochina Ext方法重写.rar

    EXT.js提供了`this.callParent()`和`this.superclass.methodName.call(this)`两种方式来实现这一点。 - **避免副作用**:重写方法时要确保不会意外影响其他代码,尤其是当你重写的是核心库的方法。 - **测试**:确保...

Global site tag (gtag.js) - Google Analytics