`
hm4123660
  • 浏览: 282851 次
  • 性别: Icon_minigender_1
  • 来自: 广州
博客专栏
Dea4ce76-f328-3ab2-b24a-fb268e1eeb75
数据结构
浏览量:70115
社区版块
存档分类
最新评论

Extjs4的Window

阅读更多

我们经常把表单和grid显示在extjs的window上,因为表单和grid的要么使用renderTo: 'login_form'渲染显示到每个html的div上,要么利用window显示。把表单或grid放在windows的item里即可显示出来

 

下面是window的一些知识总结

 

一、属性
plain:布尔类型,true表示强制与背景色保持协调,默认值为false。
resizable:布尔类型,用户是否可以调整窗体大小,默认值为true表示可以调整大小。
maxinizable:布尔类型,true表示显示最大化按钮,默认值为false。
maximized:布尔类型,true表示显示窗体时将窗体最大化,默认值为false。
closable:布尔类型,true表示显示关闭按钮,默认值为true。
bodyStyle:与边框的间距,如:bodyStyle:"padding:3px"。
buttonAlign:窗体中button的对齐方式(left、center、right),默认值为right。
closeAction:"close"释放窗体所占内存,"hide"隐藏窗体,建议使用"hide"。

二、方法
show:打开窗体。
hide:隐藏窗体。
close:关闭窗体。

三、事件
show:打开窗体时触法。
hide:隐藏窗体时触法。
close:关闭窗体时触法。

四、应用举例

代码如下:

Ext.onReady(function(){
var _window=new Ext.Window({
title:"登陆",
renderTo:Ext.getBody(),
frame:true,
plain:true,
resizable:false,
buttonAlign:"right",
closeAction:"hide",
maximizable:true,
closable:true,
bodyStyle:"padding:4px",
width:310,
height:230,
layout:"form",
lableWidth:45,
defaults:{xtype:"textfield",width:180},
items:[{fieldLabel:"帐号"},{fieldLabel:"密码"},regform

],
buttons:[{text:"确定"},{text:"取消",handler:function(){_window.hide();}}],

 

//事件监听
listeners:{
"show":function(){
alert("显示");
},
"hide":function(){
alert("隐藏");
},
"close":function(){
alert("关闭");
}
}
})
_window.show();
})

分享到:
评论

相关推荐

    Extjs4的FormPanel从后台load json数据的要点

    在本篇文章中,我们将深入探讨如何使用Extjs4中的FormPanel组件从后台加载JSON数据,并将其映射到表单的各个字段中进行显示。这是一项非常实用的技术,尤其是在需要动态填充表单的情况下。 ### 一、Extjs4 ...

    ExtJs4.2 Window常用方法

    根据提供的文件信息,本文将详细解释ExtJs 4.2中Window组件的一些常用配置属性以及方法,帮助读者更好地理解和使用这些功能。 ### ExtJs 4.2 Window 组件概述 ExtJs 是一个基于 JavaScript 的开源框架,用于创建...

    extjs3 window窗口修改完退出提示是否保存

    在EXTJS3中,开发Web应用时经常需要创建可弹出的窗口(Window)来处理用户的交互操作,例如编辑、查看或确认等。本话题主要关注如何在EXTJS3的Window组件中实现一个功能:当用户在窗口内修改了数据后,关闭窗口时...

    Extjs使用Window最小化窗口

    4. **定义最小化和还原函数**:编写`minimizeWindow`函数,这个函数应该负责处理点击事件,根据当前Window的状态进行最小化或还原操作。可以使用`show`和`hide`方法来控制Window的可见性,或者通过调整`width`和`...

    extJs3升级extjs4方案

    在 ExtJS4 中,API 也发生了很大的变化,包括 tree、tab panel、grid、window、form、chart、data stores、border layout 等等。这些变化使得大型应用程序迁移变得非常困难。 在 ExtJS3 中,我们可以使用 Ext....

    EXTJS4.0 教程实例~讲解

    title: 'ExtJS4 Window的创建,头在左' }).show(); ``` 4. **其他配置示例**: - 设置窗口标题位于底部: ```javascript Ext.create('Ext.Window', { width: 400, height: 230, x: 10, y: 300, plain: ...

    ExtJS4中文教程2 开发笔记 chm

    ExtJS4学习笔记(一)---window的创建 ExtJS4学习笔记(七)---带搜索的Grid(SearchGrid) ExtJS4学习笔记(三)---VBox的使用 ExtJS4学习笔记(九)---ExtJS4 EditGrid(可编辑的Grid) ExtJS4学习笔记(二)---HBox的使用 ...

    EXTJS4 菜单栏

    EXTJS4是一款强大的JavaScript框架,专门用于构建富客户端应用程序。其菜单栏是用户界面中一个重要的组成部分,提供了丰富的功能选项,使用户能够方便地访问和操作应用的不同部分。EXTJS4的菜单栏设计灵活,可自定义...

    ExtJS4 treepanel与girdpanel简单案例(包括MVC模式与非MVC模式)

    用ExtJS4实现的treepanel与gridpanel的简单互动案例 包含mvc开发模式与普通开发模式两种 普通开发模式:需要在引入js文件夹中的main.js文件 mvc开发模式:需要引入app文件夹中的app.js文件 适合初学extjs4的朋友

    Extjs4 权威指南(中)

    ### Extjs4 权威指南知识点总结 #### 一、Extjs4简介与获取途径 - **概述**:Extjs4是一款基于JavaScript的企业级富客户端Web应用程序开发框架,旨在简化前端开发过程,提供丰富的UI组件和强大的数据处理能力。 - ...

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

    在基于ExtJS开发Web应用程序时,经常会遇到动态创建和管理窗口(Window)的情况。这个问题描述了一个在使用ExtJS的Window组件时遇到的数据加载异常情况,特别是在窗口之间切换时。问题的核心在于,当一个新的Window...

    ExtJs4做的小程序

    ExtJS4是一个强大的JavaScript框架,主要用于构建富客户端的Web应用程序。这个"ExtJs4做的小程序"是一个基于ExtJS4的员工管理系统,展示了如何利用该框架创建功能丰富的前端应用。 首先,ExtJS4提供了丰富的组件库...

    extjs window 示例

    一个完整的extjs窗体应用,包含form布局,column布局,很实用!

    extjs4 自己写的webdesktop小实例,更新中

    ExtJS4是一个强大的JavaScript库,专门用于构建富客户端应用程序,特别是复杂的Web应用界面。这个"webdesktop1.0"压缩包包含了一个基于ExtJS4实现的Web桌面小实例,旨在帮助开发者了解如何利用ExtJS4构建类似桌面...

    extjs4-export

    4. **触发文件下载**:利用浏览器的API(如`window.navigator.msSaveBlob` for IE或`a标签的download属性` for modern browsers)来触发文件下载。在EXTJS4中,你可以创建一个按钮或菜单项,当用户点击时执行导出...

    ExtJs4登录示例

    `Ext.window.Window`是ExtJs4中的窗口组件,可以自定义大小、位置和样式。 2. **表单(Form)面板**:登录表单通常包含用户名和密码输入字段。`Ext.form.Panel`是用于创建表单的组件,它可以包含各种输入控件如文本...

    ExtJS4配置spket.docx

    ExtJS4是一款强大的JavaScript框架,用于构建富客户端Web应用程序。Spket是一款优秀的Eclipse插件,专门为JavaScript、AJAX和JSON开发提供智能代码补全、语法检查和代码模板等功能。在进行ExtJS4开发时,配置Spket...

    Extjs4.0学习笔记

    xtjs4,创建Ext组件有了新的方式,就是Ext.create(....),而且可以使用动态加载JS的方式来加快组件的渲染,我们再也不必一次加载已经达到1MB的ext-all.js了,本文介绍如何在EXTJS4中创建一个window。 共:10 小节, ...

    ExtJs做的仿桌面体系统,超酷!

    ExtJS是一种基于JavaScript的前端开发框架,用于构建富互联网应用程序(RIA)。它提供了一系列丰富的组件,包括表格、面板、窗口、菜单、工具栏等,能够帮助开发者创建出具有桌面应用般交互体验的Web应用。标题提到...

Global site tag (gtag.js) - Google Analytics