引自:http://blog.sina.com.cn/s/blog_4b67d3240100rxaz.html
在extjs 的panel中,有两个公用方法,一个是collapse():panel收缩;另一个是expand():panel展开。我们可以很好的使用这两上方法来作文章。我们可以定义一个公共变量,来进行判断panel当前所需要展开还是需要收缩。
具体怎么写,请看下面的示例:
- Ext.onReady(function() {
- var p= new Ext.Panel({
- title: 'Hello',
- width: 500,
- height: 500,
- renderTo: Ext.getBody(),
- collapsible: true
- });
- var f= 1;
- var b= new Ext.Button({
- text: '嘿嘿',
- renderTo:document.body,
- handler: function() {
- if (f=== 1) {
- p.collapse(); //panel收缩
- f= 0; //修改公共变量值
- } else {
- p.expand(); //panel展开
- f= 1; //修改公共变量值
- }
- }
- });
- })
相关推荐
在Ext JS这个强大的JavaScript框架中,Panel是一种常用的组件,用于构建复杂的用户界面。Panel提供了丰富的功能,包括布局管理、工具栏、标题、可配置性等。然而,有时我们需要对Panel进行自定义,例如添加或修改...
在EXTJS这个强大的JavaScript框架中,`Ext.Panel`和`TreePanel`是两个非常重要的组件,它们被广泛用于构建复杂的用户界面。这篇文章将探讨如何在这些组件中动态加载本地页面数据,以提升用户体验并实现灵活的数据...
其中,`Panel`是EXTJS中最基础也是最常用的一个UI组件之一。它主要用于封装其他组件,并提供布局、边框等管理功能。 #### 二、EXTJS Panel 基础用法 在本示例中,我们通过一段简单的HTML代码及JavaScript脚本创建...
在EXTJS中,"Extjs自动最大化panel"是一种高级布局技术,它允许用户创建一个能够自动适应并填充其容器的面板(Panel)。这种特性对于构建响应式和自适应的用户界面至关重要,尤其在现代Web应用中,用户期望界面能够...
2.此图片按钮背景完全为图片,没有边框,需要使用者提供2张图片,一张初始化用,一张点击后用,可在'imgPaths:'属性里填写,格式为'01.jpg~02.jpg' 3.解压后请将所有附件放置您extjs包examples文件夹里任意一个组件包...
在"extjs grid.panel 项目 源码"中,我们可以深入理解如何利用ExtJS构建一个功能完备的数据网格。 Grid Panel是ExtJS中的一个核心组件,它允许开发者以表格的形式展示大量数据,并提供多种交互功能,如排序、分页、...
在Extjs框架中,实现基于角色的权限控制是一个常见需求。Extjs主要用于构建富互联网应用(RIA),其组件化的UI构建方式与传统Web开发有较大差异。因此,对于权限的控制也要采用特定的策略来实现。上述文件内容主要...
在ExtJS 4.11框架中,Panel是常见的组件之一,用于构建用户界面的容器。Panel经常被用作其他组件的容器,如按钮、表格、表单等。有时,我们可能需要对Panel进行自定义操作,比如监听并处理Panel上的点击事件。这涉及...
在EXTJS 4.x框架中,`tabpanel`是用于创建多标签界面的组件,它可以方便地组织和切换多个视图。动态加载panel和HTML到tabpanel是提高应用性能和用户体验的有效方式,因为它允许按需加载内容,减少初始页面加载时间。...
在IT行业中,ExtJS是一个非常流行的JavaScript框架,用于构建富客户端Web应用程序。它提供了一套完整的组件库,包括表格、面板、窗口等,使得开发者能够创建功能强大的交互式用户界面。在ExtJS中,`resultGrids`通常...
在EXTJS4中,Panel和TreePanel是两个非常重要的组件,它们在构建用户界面时扮演着核心角色。本文将深入探讨Panel的accordion布局以及TreePanel的动态导航功能,帮助开发者更好地理解和运用这些特性。 首先,让我们...
标题提到的"ExtJS文字按钮列"是指在ExtJS表格中添加一列,该列包含的是文字按钮而非图片按钮。这样的设计使得用户可以更直观地理解按钮的功能,同时减少了对图形资源的依赖。 在官方3.3版本中,虽然默认提供的是...
ExtJS 4的Button组件还提供了一系列方法来控制和操作按钮的状态和行为,包括但不限于: - **enable()**:启用按钮,使其可被点击。 - **disable()**:禁用按钮,防止用户进行任何操作。 - **destroy()**:销毁按钮...
Ext各种组件的使用实例,Extjs tree+grid+form+panel 使用实例
在这个实例中,Ext.tree.Panel可能被用来展示由Accordion布局管理的各个类别,每个类别下可能包含一系列子项,这些子项通过与后台Servlet或Struts2的交互,用JSON数据填充。 总结来说,这个实例展示了如何将前端的...
extjs动态生成model、store、panel;sql拼接等多种技术难点
ExtJS Tab Panel是Ext JS库中的一个核心组件,它用于创建具有多个标签页的应用界面,类似于浏览器中的标签页。在Web应用中,Tab Panel经常被用来组织和展示大量的信息,让用户能够在一个页面上轻松切换不同的内容...
ExtJs图片按钮控件是ExtJs框架中一种增强的按钮组件,它允许开发者在按钮上显示图片,以提供更丰富的用户界面。这个控件通常用于创建具有视觉吸引力的交互式UI元素,比如导航按钮或者操作按钮。下面我们将深入探讨...
在使用过程中,要特别注意ExtJS的MVC(Model-View-Controller)架构,这是其设计的一大亮点。通过模型管理数据,视图展示数据,控制器协调两者,可以使代码结构清晰,易于维护。此外,利用Data Binding功能,可以...
主要用例子说明extjs4的form表单的运用,其中有表单属性说明,表单控件运用说明如: title:'表单', //表单标题 bodyStyle:'padding:5 5 5 5', //表单边距 height:120, //表单高度 width:200, //表单宽度 ...