`

ExtJS让被遮盖的窗体显示在最前面以及解决Ext.MessageBox提示框被TabPanel覆盖的方法

阅读更多
一、如何让ExtJS的弹出提示信息框Ext.MessageBox或者创建的Ext.Window显示在最前面:

下面是显示一个Window的JS代码:

var formPanel = MisTab1.createAddFormPanel();
var addWin = new Ext.Window({  
    title: "添加产品类别", 
    pageX: 50,
    pageY: 50,
    width: 600,  
    height: 200,  
    plain: true, 
    resizable: false,  	    
    collapsible: true,   
    closeAction: 'close',  
    closable: true,
    modal: 'true',  
    buttonAlign: "center",
    bodyStyle: "padding:20px 0 0 0",
    alwaysOnTop: true,
    items: [formPanel],  
    buttons: [{  
           text: "添 加",  
           minWidth: 70,  
           handler: function() {                
           }  
       }, {  
           text: "关 闭",  
           minWidth: 70,  
           handler: function() { 
           }  
       }]    
});	
addWin.show();

效果如图:

想要让Window显示在最前面,只要创建一个WindowGroup管理创建的Window即可,需要添加的代码如下:

var tab1GroupMgr = new Ext.WindowGroup();  
//前置窗口
tab1GroupMgr.zseed=99999;  

var addWin = new Ext.Window({  
    title: "添加产品类别", 
    pageX: 50,
    pageY: 50,
    width: 600,  
    height: 200,  
    plain: true,
    manager: tab1GroupMgr,
...

二、ExtJS弹出提示信息框Ext.MessageBox或者创建的Ext.Window被Ext.TabPanel覆盖的解决方法

出现这种原因可能是因为TabPanel设置了floating:true配置项。

floating : Boolean
True表示为浮动此面板(带有自动填充和投影的绝对定位),false...
True表示为浮动此面板(带有自动填充和投影的绝对定位),false表示为在其渲染的位置"就近"显示(默认为false)。True to float this Panel (absolute position it with automatic shimming and shadow), false to display it inline where it is rendered (defaults to false).

解决方法就是把设置的floationg:true配置项去掉:

var tabPanel = new Ext.TabPanel({
	region: 'center',
	activeTab:0,
	shadow: true,
	floating: true,    //去掉该配置项
	items: [{
		title: '欢迎页面'
	}]
});
除了文章中有特别说明,均为IT宅原创文章,转载请以链接形式注明出处。
本文链接:http://www.itzhai.com/extjs-form-to-be-displayed-on-the-front-cover-and-solve-ext-messagebox-boxes-are-covered-by-the-method-tabpanel.html
关键字: ExtJS, floating, TabPanel, 遮盖
 
 

extjs 默认是9000

Ext.WindowMgr.zseed = 999900;设置系统默认层

分享到:
评论

相关推荐

    Ext_MessageBox

    `Ext.MessageBox`是ExtJS框架中用于显示模态对话框的一个非常实用的功能组件,它可以用来展示提示信息、请求用户输入、确认操作等。下面将详细介绍`Ext.MessageBox`的各种功能和用法。 ### 一、`Ext.MessageBox....

    Extjs Ext.MessageBox.confirm 确认对话框详解

    方法,具有两个按钮“是”和“否”如果为其提供一个回调函数,则该函数将在单击按钮后被调用(包括右上角的推出按钮),所单击按钮的id将被作为唯一的参数传递到回调函数中。 调用格式: confirm(String title,...

    ExtJS Ext.MessageBox.alert()弹出对话框详解

    代码如下: Ext.onReady(function() { Ext.Msg.alert(‘提示’, ‘逗号分隔参数列表’); //这种方式非常常见的 ...接下来认识一下Ext.MessageBox Ext.MessageBox是一个工具类,他继承自Obiect对象,用来生成各种

    ExtJs消息提示框

    通常,ExtJs的消息提示框并不内置于核心库中,而是作为扩展(ux)存在,例如在`Ext.ux.window.Notification-master`这个压缩包文件中。`ux`是"User eXtension"的缩写,它是ExtJs社区开发的第三方组件,以增强原生...

    extjs弹出框 n秒后消失

    实现EXTJS弹出框在n秒后自动消失,我们可以利用EXTJS的定时器(Ext.util.DelayedTask)和弹出框(Ext.MessageBox)的配置选项。下面我们将详细讨论如何实现这个功能。 首先,EXTJS的弹出框主要通过`Ext.MessageBox....

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

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

    extjs4.2.1 tabPanel刷新及关闭标签

    ### ExtJS 4.2.1 TabPanel 刷新与关闭标签功能详解 #### TabPanel 组件简介 在ExtJS框架中,`TabPanel`组件是一个非常实用且强大的UI控件,它允许用户在一个界面上组织多个相关的视图或面板,并通过标签页的形式...

    ExtJS-3.4.0系列:Ext.TabPanel

    在本文中,我们将深入探讨ExtJS中的`Ext.TabPanel`组件,它是创建多标签界面的核心元素。`Ext.TabPanel`允许开发者在单个容器中组织多个面板或视图,每个面板都有自己的标题,并且可以通过标签页进行切换。让我们...

    extjs中Ext.Panel和TreePanel 组件动态加载本地页面数据

    在EXTJS这个强大的JavaScript框架中,`Ext.Panel`和`TreePanel`是两个非常重要的组件,它们被广泛用于构建复杂的用户界面。这篇文章将探讨如何在这些组件中动态加载本地页面数据,以提升用户体验并实现灵活的数据...

    Ext.Array例子

    在EXTJS库中,`Ext.Array` 是一个非常重要的工具类,它提供了许多方便的静态方法,用于处理JavaScript中的数组。这些方法旨在增强原生数组的功能,提高代码的可读性和效率。`Ext.Array` 包含了排序、查找、过滤、...

    ExtJs的Ext.Ajax.request实现waitMsg等待提示效果

    在这里,我们对Ext.getBody()这个返回当前文档主体DOM元素的方法返回的对象使用Ext.LoadMask,这样就会在整个页面上显示加载提示。 在用户点击确认按钮之后,我们将创建一个Ext.LoadMask实例,并调用show方法来显示...

    ExtJs自定义消息框

    其中,消息框作为一种常见的交互方式,在提示用户信息、收集用户输入以及获取用户确认等方面发挥着重要作用。本文将详细介绍ExtJs中三种常用的消息框——提示框(Alert)、输入框(Prompt)和确认框(Confirm)的...

    精通JS脚本之ExtJS框架.part2.rar

    《精通JS脚本之ExtJS框架》由浅入深地讲解了ExtJS在Web开发中的相关技术。本书共分17章,分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计...

    一个相当不错的extjs入门文档,整个ext的控件,上边很多实例。有助于新手学习。

    本文将详细介绍EXTJS中的EXT.MessageBox组件,这是EXTJS提供的一种用于弹出提示、确认和输入对话框的工具,对于新手学习EXTJS极其有用。 1. **EXT.MessageBox.alert()** `EXT.MessageBox.alert()` 方法用于创建一...

    ExtJs入门实例.doc

    `Ext.MessageBox.show()`是最灵活的方法,允许自定义配置参数来创建对话框。常见的配置项包括: - `animEl`: 设置动画效果的元素ID。 - `buttons`: 可以是预定义的按钮组合,如`Ext.Msg.OKCANCEL`,也可以自定义...

    extjs 可编辑的表格树 Ext.tree.ColumnTree Ext.tree.ColumnTreeEditor

    extjs 可编辑的表格树,每个单元格自定义编辑组件,可以自适应列宽,只有源码与例子,运行实例要修改路径,不然图片不能显示,注意etree.jsp的js引入路径 支持Ext2.x以上版本 如运行不了EmailTo : codeme9@gmail....

    Extjs学习笔记

    Ext.MessageBox 是 ExtJS 中的一个功能强大且灵活的提示框组件,提供了多种类型的提示框,包括警告框、确认框、提示框等。下面我们将详细讲解 Ext.MessageBox 的使用方法。 3.1 alert 方法 Ext.MessageBox.alert ...

    ExtJs2指南最新版

    Ext.MessageBox提供了多种功能,如警告、确认、提示和自定义对话框,这些功能使得在Web应用中实现用户交互变得非常便捷。 1. **Ext.MessageBox.alert()方法**: 这个方法用于显示一个简单的警告对话框,包含一个...

    ExtJs教程.pdf

    ExtJs教程.pdf文件主要围绕ExtJs框架的MessageBox组件介绍和演示了多种弹窗的创建和配置方式,为Web开发者提供了关于如何在用户界面上弹出信息提示框、确认框、输入框以及带有进度条的交互式弹窗的具体实现方法。...

    精通JS脚本之ExtJS框架.part1.rar

    《精通JS脚本之ExtJS框架》由浅入深地讲解了ExtJS在Web开发中的相关技术。本书共分17章,分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计...

Global site tag (gtag.js) - Google Analytics